增加密码修改页面及优化form验证

Admin.NET/Admin.NET.Core/Admin.NET.Core.csproj

@@ -24,9 +24,9 @@
 
   <ItemGroup>
     <PackageReference Include="AspNetCoreRateLimit" Version="4.0.2" />
-    <PackageReference Include="Furion.Extras.Authentication.JwtBearer" Version="4.6.2" />
-    <PackageReference Include="Furion.Extras.ObjectMapper.Mapster" Version="4.6.2" />
-    <PackageReference Include="Furion.Pure" Version="4.6.2" />
+    <PackageReference Include="Furion.Extras.Authentication.JwtBearer" Version="4.6.3" />
+    <PackageReference Include="Furion.Extras.ObjectMapper.Mapster" Version="4.6.3" />
+    <PackageReference Include="Furion.Pure" Version="4.6.3" />
     <PackageReference Include="Magicodes.IE.Excel" Version="2.6.4" />
     <PackageReference Include="Magicodes.IE.Pdf" Version="2.6.4" />
     <PackageReference Include="Microsoft.AspNetCore.Mvc.NewtonsoftJson" Version="6.0.10" />

Admin.NET/Admin.NET.Core/Service/User/Dto/UserInput.cs

@@ -80,7 +80,7 @@ public class ChangePwdInput
     /// <summary>
     /// 新密码
     /// </summary>
-    [Required(ErrorMessage = "原始密码不能为空")]
+    [Required(ErrorMessage = "新密码不能为空")]
     [StringLength(20, MinimumLength = 5, ErrorMessage = "密码需要大于5个字符")]
     public string PasswordNew { get; set; }
 }

vue-next-admin/src/views/system/menu/component/editMenu.vue

@@ -143,7 +143,7 @@
 </template>
 
 <script lang="ts">
-import { reactive, toRefs, defineComponent, getCurrentInstance, ref, unref } from 'vue';
+import { reactive, toRefs, defineComponent, getCurrentInstance, ref } from 'vue';
 import IconSelector from '/@/components/iconSelector/index.vue';
 
 import { getAPI } from '/@/utils/axios-utils';
@@ -166,7 +166,7 @@ export default defineComponent({
 	},
 	setup() {
 		const { proxy } = getCurrentInstance() as any;
-		const ruleFormRef = ref<HTMLElement | null>(null);
+		const ruleFormRef = ref();
 		const state = reactive({
 			isShowDialog: false,
 			ruleForm: {
@@ -211,13 +211,11 @@ export default defineComponent({
 		};
 		// 提交
 		const submit = () => {
-			const formWrap = unref(ruleFormRef) as any;
-			if (!formWrap) return;
-
 			// 上级菜单Id
 			if (Array.isArray(state.ruleForm.pid))
 				state.ruleForm.pid = state.ruleForm.pid[state.ruleForm.pid.length - 1];
-			formWrap.validate(async () => {
+			ruleFormRef.value.validate(async (valid: boolean) => {
+				if (!valid) return;
 				if (state.ruleForm.id != undefined && state.ruleForm.id > 0) {
 					await getAPI(SysMenuApi).sysMenuUpdatePost(state.ruleForm);
 				}

vue-next-admin/src/views/system/org/component/editOrg.vue

@@ -61,7 +61,7 @@
 </template>
 
 <script lang="ts">
-import { reactive, toRefs, defineComponent, getCurrentInstance, ref, unref } from 'vue';
+import { reactive, toRefs, defineComponent, getCurrentInstance, ref } from 'vue';
 
 import { getAPI } from '/@/utils/axios-utils';
 import { SysOrgApi } from '/@/api-services/api';
@@ -83,7 +83,7 @@ export default defineComponent({
 	},
 	setup() {
 		const { proxy } = getCurrentInstance() as any;
-		const ruleFormRef = ref<HTMLElement | null>(null);
+		const ruleFormRef = ref();
 		const state = reactive({
 			isShowDialog: false,
 			ruleForm: {
@@ -116,13 +116,11 @@ export default defineComponent({
 		};
 		// 提交
 		const submit = () => {
-			const formWrap = unref(ruleFormRef) as any;
-			if (!formWrap) return;
-
 			// 上级机构Id
 			if (Array.isArray(state.ruleForm.pid))
 				state.ruleForm.pid = state.ruleForm.pid[state.ruleForm.pid.length - 1];
-			formWrap.validate(async () => {
+			ruleFormRef.value.validate(async (valid: boolean) => {
+				if (!valid) return;
 				if (state.ruleForm.id != undefined && state.ruleForm.id > 0) {
 					await getAPI(SysOrgApi).sysOrgUpdatePost(state.ruleForm);
 				}

vue-next-admin/src/views/system/org/component/orgTree.vue

@@ -69,7 +69,6 @@ const initTreeData = async () => {
 
 // 设置默认选择
 const setCheckedKeys = (orgData: any) => {
-  console.log("设置选择")
   state.isShowCheckbox = true;
   treeRef.value!.setCheckedKeys([]);
   state.ownOrgData = orgData;

vue-next-admin/src/views/system/password/index.vue

@@ -0,0 +1,91 @@
+<template>
+	<div class="sys-password-container">
+		<NoticeBar text="账号密码修改，请慎重操作！" background="var(--el-color-primary-light-9)" color="var(--el-color-primary)" />
+		<el-card shadow="hover" header="修改当前账号密码" class="mt15">
+			<el-form ref="ruleFormRef" :model="ruleForm" status-icon :rules="ruleRules" label-width="80px">
+				<el-form-item label="当前密码" prop="passwordOld">
+					<el-input v-model="ruleForm.passwordOld" type="password" autocomplete="off" />
+				</el-form-item>
+				<el-form-item label="新密码" prop="passwordNew">
+					<el-input v-model="ruleForm.passwordNew" type="password" autocomplete="off" />
+				</el-form-item>
+				<el-form-item label="确认密码" prop="passwordNew2">
+					<el-input v-model.number="ruleForm.passwordNew2" type="password" />
+				</el-form-item>
+				<el-form-item>
+					<el-button icon="ele-Refresh" @click="reset" size="default">重 置</el-button>
+					<el-button icon="ele-Select" type="primary" @click="submit" size="default">确 定</el-button>
+				</el-form-item>
+			</el-form>
+		</el-card>
+	</div>
+</template>
+
+<script lang="ts">
+import { reactive, toRefs, defineComponent, ref } from 'vue';
+import NoticeBar from '/@/components/noticeBar/index.vue';
+import { ElMessageBox } from 'element-plus';
+import { Session } from '/@/utils/storage';
+
+import { getAPI } from '/@/utils/axios-utils';
+import { SysUserApi } from '/@/api-services/api';
+
+export default defineComponent({
+	name: 'sysPassword',
+	components: { NoticeBar },
+	setup() {
+		const ruleFormRef = ref();
+
+		const validatePassword = (rule: any, value: any, callback: any) => {
+			if (value != state.ruleForm.passwordNew) {
+				callback(new Error("两次密码不一致！"))
+			} else {
+				callback()
+			}
+		}
+		const state = reactive({
+			ruleForm: {
+				id: 0,
+				passwordOld: '',
+				passwordNew: '',
+				passwordNew2: '',
+			},
+			ruleRules: {
+				passwordOld: [{ required: true, message: "当前密码不能为空", trigger: "blur" }],
+				passwordNew: [{ required: true, message: "新密码不能为空", trigger: "blur" }],
+				passwordNew2: [{ validator: validatePassword, required: true, trigger: "blur" }],
+			},
+		});
+		// 重置
+		const reset = () => {
+			state.ruleForm.passwordOld = "";
+			state.ruleForm.passwordNew = "";
+			state.ruleForm.passwordNew2 = "";
+		};
+		// 提交
+		const submit = () => {
+			ruleFormRef.value.validate(async (valid: boolean) => {
+				if (!valid) return;
+				await getAPI(SysUserApi).sysUserChangeUserPwdPost(state.ruleForm);
+				// 退出系统
+				ElMessageBox.confirm('密码已修改，是否重新登录系统？', '提示', {
+					confirmButtonText: '确定',
+					cancelButtonText: '取消',
+					type: 'warning',
+				})
+					.then(async () => {
+						// 清除缓存
+						Session.clear();
+						window.location.reload();
+					});
+			})
+		};
+		return {
+			ruleFormRef,
+			reset,
+			submit,
+			...toRefs(state),
+		};
+	},
+});
+</script>

vue-next-admin/src/views/system/pos/component/editPos.vue

@@ -50,7 +50,7 @@
 </template>
 
 <script lang="ts">
-import { reactive, toRefs, defineComponent, getCurrentInstance, ref, unref } from 'vue';
+import { reactive, toRefs, defineComponent, getCurrentInstance, ref } from 'vue';
 
 import { getAPI } from '/@/utils/axios-utils';
 import { SysPosApi } from '/@/api-services/api';
@@ -67,7 +67,7 @@ export default defineComponent({
 	},
 	setup() {
 		const { proxy } = getCurrentInstance() as any;
-		const ruleFormRef = ref<HTMLElement | null>(null);
+		const ruleFormRef = ref();
 		const state = reactive({
 			isShowDialog: false,
 			ruleForm: {
@@ -99,10 +99,8 @@ export default defineComponent({
 		};
 		// 提交
 		const submit = () => {
-			const formWrap = unref(ruleFormRef) as any;
-			if (!formWrap) return;
-
-			formWrap.validate(async () => {
+			ruleFormRef.value.validate(async (valid: boolean) => {
+				if (!valid) return;
 				if (state.ruleForm.id != undefined && state.ruleForm.id > 0) {
 					await getAPI(SysPosApi).sysPosUpdatePost(state.ruleForm);
 				}

vue-next-admin/src/views/system/role/component/editRole.vue

@@ -59,7 +59,7 @@
 </template>
 
 <script lang="ts">
-import { reactive, toRefs, defineComponent, getCurrentInstance, ref, unref, onMounted } from 'vue';
+import { reactive, toRefs, defineComponent, getCurrentInstance, ref, onMounted } from 'vue';
 import type { ElTree } from 'element-plus';
 import type Node from 'element-plus/es/components/tree/src/model/node'
 
@@ -83,7 +83,7 @@ export default defineComponent({
 	},
 	setup() {
 		const { proxy } = getCurrentInstance() as any;
-		const ruleFormRef = ref<HTMLElement | null>(null);
+		const ruleFormRef = ref();
 		const treeRef = ref<InstanceType<typeof ElTree>>()
 		const state = reactive({
 			loading: true,
@@ -126,10 +126,8 @@ export default defineComponent({
 		};
 		// 提交
 		const submit = () => {
-			const formWrap = unref(ruleFormRef) as any;
-			if (!formWrap) return;
-
-			formWrap.validate(async () => {
+			ruleFormRef.value.validate(async (valid: boolean) => {
+				if (!valid) return;
 				state.ruleForm.menuIdList = treeRef.value?.getCheckedKeys(); //.concat(treeRef.value?.getHalfCheckedKeys());
 				if (state.ruleForm.id != undefined && state.ruleForm.id > 0) {
 					await getAPI(SysRoleApi).sysRoleUpdatePost(state.ruleForm);

vue-next-admin/src/views/system/role/component/grantData.vue

@@ -1,16 +1,24 @@
 <template>
-	<div class="sys-grantOrg-container">
+	<div class="sys-grantData-container">
 		<el-dialog v-model="isShowDialog" width="450px">
 			<template #header>
 				<div style="font-size: large" v-drag="['.el-dialog','.el-dialog__header']">
 					授权数据范围
 				</div>
 			</template>
-			<el-form :model="ruleForm" size="default" label-width="80px">
+			<el-form :model="ruleForm" size="default">
 				<el-row :gutter="35">
-					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl1="24">
-						<el-form-item prop="orgIdList">
-							<OrgTree ref="orgTreeRef" />
+					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl1="24" class="mb20">
+						<el-form-item prop="dataScope" label="数据范围">
+							<el-select v-model="ruleForm.dataScope" placeholder="数据范围" style="width: 100%">
+								<el-option v-for="d in dataScopeType" :key="d.value" :label="d.label"
+									:value="d.value" />
+							</el-select>
+						</el-form-item>
+					</el-col>
+					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl1="24" v-show="ruleForm.dataScope === 5">
+						<el-form-item prop="orgIdList" label="机构列表">
+							<OrgTree ref="orgTreeRef" class="w100" />
 						</el-form-item>
 					</el-col>
 				</el-row>
@@ -30,7 +38,7 @@ import { reactive, toRefs, defineComponent, ref } from 'vue';
 import OrgTree from '/@/views/system/org/component/orgTree.vue';
 
 import { getAPI } from '/@/utils/axios-utils';
-import { SysUserApi } from '/@/api-services/api';
+import { SysRoleApi } from '/@/api-services/api';
 
 export default defineComponent({
 	name: 'sysGrantData',
@@ -41,14 +49,15 @@ export default defineComponent({
 			isShowDialog: false,
 			ruleForm: {
 				id: 0,
-				org: 0, // 用户所属机构
+				dataScope: 0, // 数据范围
 				orgIdList: [] as any, // 机构集合
 			},
+			dataScopeType: [{ value: 1, label: "全部数据" }, { value: 2, label: "本部门及以下数据" }, { value: 3, label: "本部门数据" }, { value: 4, label: "仅本人数据" }, { value: 5, label: "自定义数据" }], // 数据范围类型			
 		});
 		// 打开弹窗
 		const openDialog = async (row: any) => {
 			state.ruleForm = row;
-			var res = await getAPI(SysUserApi).sysUserOwnOrgGet(row.id);
+			var res = await getAPI(SysRoleApi).sysRoleOwnOrgGet(row.id);
 			setTimeout(() => { // 延迟传递数据
 				orgTreeRef.value?.setCheckedKeys(res.data.result);
 			}, 100);
@@ -60,8 +69,9 @@ export default defineComponent({
 		};
 		// 提交
 		const submit = async () => {
-			state.ruleForm.orgIdList = orgTreeRef.value?.getCheckedKeys();
-			await getAPI(SysUserApi).sysUserGrantOrgPost(state.ruleForm);
+			if (state.ruleForm.dataScope === 5)
+				state.ruleForm.orgIdList = orgTreeRef.value?.getCheckedKeys();
+			await getAPI(SysRoleApi).sysRoleGrantDataPost(state.ruleForm);
 			state.isShowDialog = false;
 		};
 		return {

vue-next-admin/src/views/system/role/index.vue

@@ -37,6 +37,15 @@
 				<el-table-column prop="name" label="角色名称" show-overflow-tooltip>
 				</el-table-column>
 				<el-table-column prop="code" label="角色编码" show-overflow-tooltip></el-table-column>
+				<el-table-column label="数据范围" align="center" show-overflow-tooltip>
+					<template #default="scope">
+						<el-tag effect="plain" v-if="scope.row.dataScope === 1">全部数据</el-tag>
+						<el-tag effect="plain" v-else-if="scope.row.dataScope === 2">本部门及以下数据</el-tag>
+						<el-tag effect="plain" v-else-if="scope.row.dataScope === 3">本部门数据</el-tag>
+						<el-tag effect="plain" v-else-if="scope.row.dataScope === 4">仅本人数据</el-tag>
+						<el-tag effect="plain" v-else-if="scope.row.dataScope === 5">自定义数据</el-tag>
+					</template>
+				</el-table-column>
 				<el-table-column prop="order" label="排序" width="70" align="center" show-overflow-tooltip>
 				</el-table-column>
 				<el-table-column label="状态" width="70" align="center" show-overflow-tooltip>
@@ -60,7 +69,7 @@
 							</span>
 							<template #dropdown>
 								<el-dropdown-menu>
-									<el-dropdown-item icon="ele-OfficeBuilding" @click="delRole(scope.row)">
+									<el-dropdown-item icon="ele-OfficeBuilding" @click="openGrantData(scope.row)">
 										数据范围
 									</el-dropdown-item>
 									<el-dropdown-item icon="ele-Delete" @click="delRole(scope.row)">
@@ -79,6 +88,7 @@
 		</el-card>
 
 		<EditRole ref="editRoleRef" :title="editRoleTitle" :ownMenuData="ownMenuData" />
+		<GrantData ref="grantDataRef" />
 	</div>
 </template>
 
@@ -86,23 +96,24 @@
 import { ref, toRefs, reactive, onMounted, defineComponent, getCurrentInstance, onUnmounted } from 'vue';
 import { ElMessageBox, ElMessage } from 'element-plus';
 import EditRole from '/@/views/system/role/component/editRole.vue';
+import GrantData from '/@/views/system/role/component/grantData.vue';
 
 import { getAPI } from '/@/utils/axios-utils';
 import { SysRoleApi } from '/@/api-services/api';
 
 export default defineComponent({
 	name: 'sysRole',
-	components: { EditRole },
+	components: { EditRole, GrantData },
 	setup() {
 		const { proxy } = getCurrentInstance() as any;
 		const editRoleRef = ref();
+		const grantDataRef = ref();
 		const state = reactive({
 			loading: true,
 			roleData: [] as any,
 			queryParams: {
 				name: undefined,
 				code: undefined,
-
 			},
 			tableParams: {
 				page: 1,
@@ -174,15 +185,21 @@ export default defineComponent({
 			state.tableParams.page = val;
 			handleQuery();
 		};
+		// 打开授权数据范围页面
+		const openGrantData = (row: any) => {
+			grantDataRef.value.openDialog(row);
+		};
 		return {
 			handleQuery,
 			resetQuery,
 			editRoleRef,
+			grantDataRef,
 			openAddRole,
 			openEditRole,
 			delRole,
 			handleSizeChange,
 			handleCurrentChange,
+			openGrantData,
 			...toRefs(state),
 		};
 	},

vue-next-admin/src/views/system/user/component/editUser.vue

@@ -129,7 +129,7 @@
 </template>
 
 <script lang="ts">
-import { reactive, toRefs, defineComponent, getCurrentInstance, ref, unref, onMounted } from 'vue';
+import { reactive, toRefs, defineComponent, getCurrentInstance, ref, onMounted } from 'vue';
 
 import { getAPI } from '/@/utils/axios-utils';
 import { SysPosApi, SysRoleApi, SysUserApi } from '/@/api-services/api';
@@ -151,7 +151,7 @@ export default defineComponent({
 	},
 	setup() {
 		const { proxy } = getCurrentInstance() as any;
-		const ruleFormRef = ref<HTMLElement | null>(null);
+		const ruleFormRef = ref();
 		const state = reactive({
 			isShowDialog: false,
 			ruleForm: {
@@ -215,13 +215,11 @@ export default defineComponent({
 		};
 		// 提交
 		const submit = () => {
-			const formWrap = unref(ruleFormRef) as any;
-			if (!formWrap) return;
-
 			// 所属机构Id
 			if (Array.isArray(state.ruleForm.orgId))
 				state.ruleForm.orgId = state.ruleForm.orgId[state.ruleForm.orgId.length - 1];
-			formWrap.validate(async () => {
+			ruleFormRef.value.validate(async (valid: boolean) => {
+				if (!valid) return;
 				if (state.ruleForm.id != undefined && state.ruleForm.id > 0) {
 					await getAPI(SysUserApi).sysUserUpdatePost(state.ruleForm);
 				}