feat(部门管理): 重设密码添加

web/.env.development

@@ -2,7 +2,7 @@
 ENV = 'development'
 
 # 本地环境接口地址
-VITE_API_URL = 'http://127.0.0.1:8000'
+VITE_API_URL = 'http://huge-dream.natapp1.cc/'
 
 # 是否启用按钮权限
 VITE_PM_ENABLED = true

web/src/views/system/dept/components/DeptUserCom/api.ts

@@ -1,13 +1,13 @@
 import { request, downloadFile } from '/@/utils/service';
 import { PageQuery, AddReq, DelReq, EditReq, InfoReq } from '@fast-crud/fast-crud';
 
-type GetListType = PageQuery & { show_all: string }
+type GetListType = PageQuery & { show_all: string };
 
 export const apiPrefix = '/api/system/user/';
 
 export function GetDept(query: PageQuery) {
 	return request({
-		url: "/api/system/dept/dept_lazy_tree/",
+		url: '/api/system/dept/dept_lazy_tree/',
 		method: 'get',
 		params: query,
 	});
@@ -55,8 +55,8 @@ export function exportData(params: any) {
 	return downloadFile({
 		url: apiPrefix + 'export_data/',
 		params: params,
-		method: 'get'
-	})
+		method: 'get',
+	});
 }
 
 export function getDeptInfoById(id: string, type: string) {
@@ -65,3 +65,11 @@ export function getDeptInfoById(id: string, type: string) {
 		method: 'get',
 	});
 }
+
+export function resetPwd(id: number, data: { [key: string]: string }) {
+	return request({
+		url: `/api/system/user/${id}/reset_password/`,
+		method: 'put',
+		data,
+	});
+}

web/src/views/system/dept/components/DeptUserCom/crud.tsx

@@ -103,6 +103,7 @@ export const createCrudOptions = function ({ crudExpose, context }: CreateCrudOp
 						},
 						click: (ctx: any) => {
 							const { row } = ctx;
+							context?.handleResetPwdOpen(row);
 						},
 					},
 				},

web/src/views/system/dept/components/DeptUserCom/index.vue

@@ -43,16 +43,31 @@
 			<importExcel api="api/system/user/">导入 </importExcel>
 		</template>
 	</fs-crud>
+
+	<el-dialog v-model="resetPwdVisible" title="重设密码" width="400px" draggable :before-close="handleResetPwdClose">
+		<div>
+			<el-input v-model="resetPwdFormState.newPassword" type="password" placeholder="请输入密码" show-password style="margin-bottom: 20px" />
+			<el-input v-model="resetPwdFormState.newPassword2" type="password" placeholder="请再次输入密码" show-password />
+		</div>
+		<template #footer>
+			<span class="dialog-footer">
+				<el-button @click="handleResetPwdClose">取消</el-button>
+				<el-button type="primary" @click="handleResetPwdSubmit"> 保存 </el-button>
+			</span>
+		</template>
+	</el-dialog>
 </template>
 
 <script lang="ts" setup name="user">
-import { ref, onMounted } from 'vue';
+import { ref, reactive, onMounted } from 'vue';
 import { useExpose, useCrud } from '@fast-crud/fast-crud';
+import { Md5 } from 'ts-md5';
 import { createCrudOptions } from './crud';
 import importExcel from '/@/components/importExcel/index.vue';
 import * as echarts from 'echarts';
 import { ECharts, EChartsOption, init } from 'echarts';
-import { getDeptInfoById } from './api';
+import { getDeptInfoById, resetPwd } from './api';
+import { warningNotification, successNotification } from '/@/utils/message';
 import { HeadDeptInfoType } from '../../types';
 
 let deptCountChart: ECharts;
@@ -72,6 +87,13 @@ let isShowChildFlag = ref(false);
 let deptInfo = ref<Partial<HeadDeptInfoType>>({});
 let showCount = ref(false);
 
+let resetPwdVisible = ref(false);
+let resetPwdFormState = reactive({
+	id: 0,
+	newPassword: '',
+	newPassword2: '',
+});
+
 /**
  * 初始化顶部部门折线图
  */
@@ -189,6 +211,45 @@ const handleSwitchChange = () => {
 	handleDoRefreshUser(currentDeptId.value);
 };
 
+const handleResetPwdOpen = ({ id }: { id: number }) => {
+	resetPwdFormState.id = id;
+	resetPwdVisible.value = true;
+};
+const handleResetPwdClose = () => {
+	resetPwdVisible.value = false;
+	resetPwdFormState.id = 0;
+	resetPwdFormState.newPassword = '';
+	resetPwdFormState.newPassword2 = '';
+};
+const handleResetPwdSubmit = async () => {
+	if (!resetPwdFormState.id) {
+		warningNotification('请选择用户！');
+		return;
+	}
+	if (!resetPwdFormState.newPassword || !resetPwdFormState.newPassword2) {
+		warningNotification('请输入密码！');
+		return;
+	}
+	if (resetPwdFormState.newPassword !== resetPwdFormState.newPassword2) {
+		warningNotification('两次输入密码不一致');
+		return;
+	}
+	const pwdRegex = new RegExp('(?=.*[0-9])(?=.*[a-zA-Z]).{8,30}');
+	if (!pwdRegex.test(resetPwdFormState.newPassword) || !pwdRegex.test(resetPwdFormState.newPassword2)) {
+		warningNotification('您的密码复杂度太低(密码中必须包含字母、数字)');
+		return;
+	}
+	const res = await resetPwd(resetPwdFormState.id, {
+		newPassword: Md5.hashStr(resetPwdFormState.newPassword),
+		newPassword2: Md5.hashStr(resetPwdFormState.newPassword2),
+	});
+
+	if (res?.code === 2000) {
+		successNotification(res.msg || '修改成功！');
+		handleResetPwdClose();
+	}
+};
+
 onMounted(() => {
 	crudExpose.doRefresh();
 	deptCountChart = init(deptCountBar.value as HTMLElement);
@@ -201,7 +262,7 @@ defineExpose({
 });
 
 // 你的crud配置
-const { crudOptions } = createCrudOptions({ crudExpose, context: { getDeptInfo, isShowChildFlag } });
+const { crudOptions } = createCrudOptions({ crudExpose, context: { getDeptInfo, isShowChildFlag, handleResetPwdOpen } });
 
 // 初始化crud配置
 const { resetCrudOptions } = useCrud({