From 090e552374dc3e85cfe69e11652e564b4936ca7e Mon Sep 17 00:00:00 2001
From: dshclm <3321914460@qq.com>
Date: Thu, 22 Aug 2024 16:05:50 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BA=BA=E5=91=98=E8=AE=B0=E5=BD=95=E6=9F=A5?=
 =?UTF-8?q?=E8=AF=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../templates/system/user/changeRecord.html   | 179 ++++++++++++++++++
 .../resources/templates/system/user/user.html |  18 +-
 2 files changed, 196 insertions(+), 1 deletion(-)
 create mode 100644 ruoyi-admin/src/main/resources/templates/system/user/changeRecord.html
diff --git a/ruoyi-admin/src/main/resources/templates/system/user/changeRecord.html b/ruoyi-admin/src/main/resources/templates/system/user/changeRecord.html
new file mode 100644
index 0000000..43f8eed
--- /dev/null
+++ b/ruoyi-admin/src/main/resources/templates/system/user/changeRecord.html
@@ -0,0 +1,179 @@
+<!DOCTYPE html>
+<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
+<head>
+    <th:block th:include="include :: header('涉密人员培训详情')" />
+    <th:block th:include="include :: element-css" />
+</head>
+<style>
+.ibox-content{
+    height: 100%;
+}
+.max-box{
+    width: 100%;
+    height: 100%;
+}
+.min-box{
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+.left-card{
+    width: 48%;
+    height: 100%;
+}
+.right-card{
+    width: 48%;
+    height: 100%;
+}
+.text {
+    font-size: 14px;
+}
+
+.item {
+    margin-bottom: 18px;
+}
+
+.clearfix:before,
+.clearfix:after {
+    display: table;
+    content: "";
+}
+.clearfix:after {
+    clear: both
+}
+
+.box-card {
+    width: 480px;
+}
+.weight{
+    font-weight: bold;
+    margin-right: 10px;
+}
+.diff { color: red; }
+.same { color: green; }
+</style>
+<body class="white-bg">
+<div class="wrapper wrapper-content animated fadeInRight ibox-content" id="app">
+    <div class="max-box">
+        <div class="min-box">
+            <el-card class="left-card">
+                <div slot="header" class="clearfix">
+                    <span style="font-size: 16px;font-weight: bold">修改前</span>
+                </div>
+                <div v-for="(item, index) in userBeforeList" :key="item.userId" class="text item">
+                    <p class="leftCard">
+                        <span class="weight">人员姓名: </span>
+                        <span :class="getDiffClass(item.userName, 'userName', index)">{{ item.userName }}</span>
+                    </p>
+                    <p class="leftCard">
+                        <span class="weight">身份证号: </span>
+                        <span :class="getDiffClass(item.cerno, 'cerno', index)">{{ item.cerno }}</span>
+                    </p>
+                    <p class="leftCard">
+                        <span class="weight">手机: </span>
+                        <span :class="getDiffClass(item.phonenumber, 'phonenumber', index)">{{ item.phonenumber }}</span>
+                    </p>
+                    <p class="leftCard">
+                        <span class="weight">性别: </span>
+                        <span :class="getDiffClass(item.sex, 'sex', index)">{{ item.sex == '0' ? '男' : '女' }}</span>
+                    </p>
+                    <p class="leftCard">
+                        <span class="weight">籍贯: </span>
+                        <span :class="getDiffClass(item.userarea, 'userarea', index)">{{ item.userarea }}</span>
+                    </p>
+                    <p class="leftCard">
+                        <span class="weight">是否具有出入境备案: </span>
+                        <span :class="getDiffClass(item.entryexitFiling, 'entryexitFiling', index)">{{ item.entryexitFiling == '1' ? '是' : '否' }}</span>
+                    </p>
+                    <p class="leftCard">
+                        <span class="weight">是否持有护照或港澳通行证: </span>
+                        <span :class="getDiffClass(item.havePassport, 'havePassport', index)">{{ item.havePassport == '1' ? '是' : '否' }}</span>
+                    </p>
+                    <hr>
+                </div>
+            </el-card>
+
+            <el-card class="right-card">
+                <div slot="header" class="clearfix">
+                    <span style="font-size: 16px;font-weight: bold">修改后</span>
+                </div>
+                <div v-for="(item, index) in userAfterList" :key="item.userId" class="text item">
+                    <p class="rightCard">
+                        <span class="weight">人员姓名: </span>
+                        <span :class="getDiffClass(item.userName, 'userName', index)">{{ item.userName }}</span>
+                    </p>
+                    <p class="rightCard">
+                        <span class="weight">身份证号: </span>
+                        <span :class="getDiffClass(item.cerno, 'cerno', index)">{{ item.cerno }}</span>
+                    </p>
+                    <p class="rightCard">
+                        <span class="weight">手机: </span>
+                        <span :class="getDiffClass(item.phonenumber, 'phonenumber', index)">{{ item.phonenumber }}</span>
+                    </p>
+                    <p class="rightCard">
+                        <span class="weight">性别: </span>
+                        <span :class="getDiffClass(item.sex, 'sex', index)">{{ item.sex == '0' ? '男' : '女' }}</span>
+                    </p>
+                    <p class="rightCard">
+                        <span class="weight">籍贯: </span>
+                        <span :class="getDiffClass(item.userarea, 'userarea', index)">{{ item.userarea }}</span>
+                    </p>
+                    <p class="rightCard">
+                        <span class="weight">是否具有出入境备案: </span>
+                        <span :class="getDiffClass(item.entryexitFiling, 'entryexitFiling', index)">{{ item.entryexitFiling == '1' ? '是' : '否' }}</span>
+                    </p>
+                    <p class="rightCard">
+                        <span class="weight">是否持有护照或港澳通行证: </span>
+                        <span :class="getDiffClass(item.havePassport, 'havePassport', index)">{{ item.havePassport == '1' ? '是' : '否' }}</span>
+                    </p>
+                    <hr>
+                </div>
+            </el-card>
+        </div>
+    </div>
+</div>
+<th:block th:include="include :: footer" />
+<th:block th:include="include :: element-js" />
+<script th:inline="javascript">
+    var app = new Vue({
+        el: '#app',
+        data: {
+            userAfterList:[],
+            userBeforeList:[],
+            diffData: []
+        },
+        mounted(){
+            this.userAfterList = [[${userRecordDTO}]].userAfterList
+            this.userBeforeList = [[${userRecordDTO}]].userBeforeList
+            this.findDifferences()
+        },
+        methods:{
+            findDifferences() {
+                // 将差异数据初始化为空数组
+                this.diffData = this.userBeforeList.map((beforeItem, index) => {
+                    let afterItem = this.userAfterList[index];
+                    let diff = {};
+
+                    for (let key in beforeItem) {
+                        if (beforeItem[key] !== afterItem[key]) {
+                            diff[key] = {
+                                before: beforeItem[key],
+                                after: afterItem[key]
+                            };
+                        }
+                    }
+                    return diff;
+                });
+            },
+            getDiffClass(value, key, index) {
+                if (this.diffData[index] && this.diffData[index][key]) {
+                    return value === this.diffData[index][key].after ? 'diff' : 'same';
+                }
+                return '';
+            }
+        }
+    })
+</script>
+</body>
+</html>
diff --git a/ruoyi-admin/src/main/resources/templates/system/user/user.html b/ruoyi-admin/src/main/resources/templates/system/user/user.html
index 1408100..4abdc01 100644
--- a/ruoyi-admin/src/main/resources/templates/system/user/user.html
+++ b/ruoyi-admin/src/main/resources/templates/system/user/user.html
@@ -187,6 +187,7 @@
 			                var more = [];
 			                more.push("<a class='btn btn-default btn-xs " + resetPwdFlag + "' href='javascript:void(0)' onclick='resetPwd(" + row.userId + ")'><i class='fa fa-key'></i>重置密码</a> ");
 			                more.push("<a class='btn btn-default btn-xs " + editFlag + "' href='javascript:void(0)' onclick='authRole(" + row.userId + ")'><i class='fa fa-check-square-o'></i>分配角色</a>");
+							more.push("<a class='btn btn-default btn-xs " + "' href='javascript:void(0)' onclick='handleDetail(" + row.userId + ")'><i class='fa fa-check-square-o'></i>修改详情</a>");
 			                actions.push('<a tabindex="0" class="btn btn-info btn-xs" role="button" data-container="body" data-placement="left" data-toggle="popover" data-html="true" data-trigger="hover" data-content="' + more.join('') + '"><i class="fa fa-chevron-circle-right"></i>更多操作</a>');
 			                return actions.join('');
 		            	} else {
@@ -252,7 +253,22 @@
 		    var url = prefix + '/resetPwd/' + userId;
 		    $.modal.open("重置密码", url, '800', '300');
 		}
-
+		function handleDetail(userId){
+			table.set();
+			var _url = prefix + '/getChangeRecord/' + userId;
+			var options = {
+				title:'人员信息修改记录',
+				width: '900',
+				height: '900',
+				url: _url,
+				skin: 'layui-layer-gray',
+				btn: ['关闭'],
+				yes: function (index, layero) {
+					$.modal.close(index);
+				}
+			};
+			$.modal.openOptions(options);
+		}
 		/* 用户管理-分配角色 */
 		function authRole(userId) {
 		    var url = prefix + '/authRole/' + userId;
