From 4b2e902503ac1fabde7340ca26a1adbc0018d118 Mon Sep 17 00:00:00 2001
From: 艺术家 <10819716+q100102@user.noreply.gitee.com>
Date: 星期三, 11 六月 2025 17:31:41 +0800
Subject: [PATCH] 代码提交
---
项目代码/伸缩杆/client/src/views/tts/UserManagement/Usermanagement.vue | 538 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-
1 files changed, 526 insertions(+), 12 deletions(-)
diff --git "a/\351\241\271\347\233\256\344\273\243\347\240\201/\344\274\270\347\274\251\346\235\206/client/src/views/tts/UserManagement/Usermanagement.vue" "b/\351\241\271\347\233\256\344\273\243\347\240\201/\344\274\270\347\274\251\346\235\206/client/src/views/tts/UserManagement/Usermanagement.vue"
index 3b86e55..da848c7 100644
--- "a/\351\241\271\347\233\256\344\273\243\347\240\201/\344\274\270\347\274\251\346\235\206/client/src/views/tts/UserManagement/Usermanagement.vue"
+++ "b/\351\241\271\347\233\256\344\273\243\347\240\201/\344\274\270\347\274\251\346\235\206/client/src/views/tts/UserManagement/Usermanagement.vue"
@@ -26,6 +26,12 @@
>
鐢ㄦ埛鍗曚綅
</div>
+ <div
+ :class="['item', isactive == 5 ? 'isactive' : '']"
+ @click="changeactive(5)"
+ >
+ 鐢ㄦ埛IP
+ </div>
</div>
<div class="serch">
<div class="time_box">
@@ -161,6 +167,31 @@
><el-icon style="margin-right: 0.2rem"> <Plus /> </el-icon
>鏂板缓</el-button
>
+ <!-- 鐢ㄦ埛IP鏂板缓 -->
+ <el-button
+ v-if="isactive == 5"
+ type="primary"
+ size="small"
+ @click="Addip"
+ style="
+ width: 5.5rem;
+ height: 2rem;
+ font-size: 0.88rem;
+ display: flex;
+ align-items: center;
+ "
+ class="text_btn"
+ ><el-icon style="margin-right: 0.2rem"> <Plus /> </el-icon
+ >鏂板缓</el-button
+ >
+ <el-button
+ type="primary"
+ size="small"
+ style="width: 5.5rem; height: 2rem; font-size: 0.88rem"
+ class="text_btn"
+ @click="registerdialogVisible = true"
+ >浜鸿劯娉ㄥ唽</el-button
+ >
<el-button
size="small"
style="width: 5.5rem; height: 2rem; font-size: 0.88rem"
@@ -243,8 +274,8 @@
min-width="2%"
>
<template #default="scope">
- <span v-if="scope.row.isLeader == 0">缁勫憳</span>
- <span v-else-if="scope.row.isLeader == 1">缁勯暱</span>
+ <span v-if="scope.row.isLeader == 0">浜岀骇</span>
+ <span v-else-if="scope.row.isLeader == 1">涓�绾�</span>
</template>
</el-table-column>
<el-table-column
@@ -382,10 +413,10 @@
>
</template>
</el-table-column>
- <el-table-column prop="isLeader" label="缁勫憳绫诲瀷" align="center">
+ <el-table-column prop="isLeader" label="鐢ㄦ埛绫诲瀷" align="center">
<template #default="scope">
- <span v-if="scope.row.isLeader == 0">缁勫憳</span>
- <span v-else-if="scope.row.isLeader == 1">缁勯暱</span>
+ <span v-if="scope.row.isLeader == 0">浜岀骇</span>
+ <span v-else-if="scope.row.isLeader == 1">涓�绾�</span>
</template>
</el-table-column>
<el-table-column prop="deptName" label="澶囨敞" align="center" />
@@ -554,6 +585,63 @@
</template></el-table-column
>
</el-table>
+
+ <!-- 鐢ㄦ埛IP -->
+ <el-table
+ empty-text="鏆傛棤鏁版嵁"
+ :height="isMin ? '950' : '450'"
+ v-if="isactive == 5"
+ :data="ipData"
+ style="width: 100%"
+ :header-cell-style="
+ isMin
+ ? {
+ background: 'rgba(250,250,250,1)',
+ color: '#101010',
+ fontSize: '1.5rem',
+ height: '3rem',
+ border: 'none',
+ }
+ : {
+ background: 'rgba(250,250,250,1)',
+ color: '#101010',
+ fontSize: '0.88rem',
+ height: '3rem',
+ border: 'none',
+ }
+ "
+ :row-style="
+ isMin
+ ? {
+ color: '#101010',
+ fontSize: '1.88rem',
+ height: '3rem',
+ }
+ : {
+ color: '#101010',
+ fontSize: '0.88rem',
+ height: '3rem',
+ }
+ "
+ @selection-change="IpSelectionChange"
+ >
+ <el-table-column type="selection" align="center" />
+ <el-table-column prop="iPaddress" label="ip鍦板潃" align="center" />
+ <el-table-column prop="addressname" label="妫�淇亾" align="center" />
+ <el-table-column label="鎿嶄綔" align="center">
+ <template #default="scope">
+ <span
+ :style="{
+ color: 'blue',
+ fontSize: isMin ? '1.88rem' : '0.88rem',
+ cursor: 'pointer',
+ }"
+ @click="Editip(scope.row)"
+ >缂栬緫</span
+ >
+ </template></el-table-column
+ >
+ </el-table>
</div>
<div
style="
@@ -566,7 +654,7 @@
>
<el-pagination
v-if="isactive == 1"
- size="small"
+ size="large"
background
layout="prev, pager, next"
:current-page="pageQuery.page"
@@ -679,7 +767,7 @@
<span
style="font-size: 0.88rem; color: black; font-weight: bold"
class="from_title"
- >鐢ㄦ埛瑙掕壊
+ >瑙掕壊鍚嶅瓧
</span>
</div>
</template>
@@ -1263,6 +1351,120 @@
</template>
</el-dialog>
+ <!-- 鐢ㄦ埛ip鏂板缓/缂栬緫 -->
+ <el-dialog
+ v-model="dialogipVisible"
+ title=""
+ width="40%"
+ :before-close="handleClose"
+ :show-close="false"
+ :align-center="true"
+ @close="resetForm4(formipRef)"
+ >
+ <template #title>
+ <div
+ style="
+ height: 3.63rem;
+ display: flex;
+ border-bottom: 1px solid #e6e6e6;
+ "
+ >
+ <span
+ :style="{
+ color: 'rgb(16, 16, 16)',
+ fontSize: isMin ? '2rem' : '1rem',
+ fontWeight: 'bold',
+ }"
+ >鐢ㄦ埛ip</span
+ >
+ </div>
+ </template>
+ <el-form
+ :model="formip"
+ label-width="auto"
+ label-position="top"
+ ref="formipRef"
+ :rules="ipRules"
+ :hide-required-asterisk="true"
+ >
+ <el-form-item prop="iPaddress">
+ <template #label>
+ <div style="display: flex; align-items: flex-end">
+ <span
+ :style="{
+ color: 'red',
+ marginRight: '0.2rem',
+ fontSize: '2rem',
+ }"
+ >*</span
+ >
+ <span
+ :style="{
+ fontSize: isMin ? '2rem' : '0.88rem',
+ color: 'black',
+ fontWeight: bold,
+ }"
+ >ip鍦板潃</span
+ >
+ </div>
+ </template>
+ <el-input
+ style="height: 2rem"
+ size="small"
+ v-model="formip.iPaddress"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ <el-form-item prop="addressname">
+ <template #label>
+ <div style="display: flex; align-items: flex-end">
+ <span
+ :style="{
+ color: 'red',
+ marginRight: '0.2rem',
+ fontSize: '2rem',
+ }"
+ >*</span
+ >
+ <span
+ :style="{
+ fontSize: isMin ? '2rem' : '0.88rem',
+ color: 'black',
+ fontWeight: bold,
+ }"
+ >妫�淇亾</span
+ >
+ </div>
+ </template>
+ <el-input
+ style="height: 2rem"
+ size="small"
+ v-model="formip.addressname"
+ placeholder="璇疯緭鍏�"
+ />
+ </el-form-item>
+ </el-form>
+ <template #footer>
+ <div class="dialog-footer" style="text-align: center">
+ <el-button
+ size="small"
+ @click="dialogipVisible = false"
+ style="height: 2rem; font-size: 0.88rem"
+ >鍙栨秷</el-button
+ >
+
+ <el-button
+ size="small"
+ type="primary"
+ @click="saveIp(formipRef)"
+ style="height: 2rem; font-size: 0.88rem"
+ >
+ 淇濆瓨
+ </el-button>
+ </div>
+ </template>
+ </el-dialog>
+
<el-dialog v-model="imgdialogVisible" width="35%" top="3vh">
<div
style="
@@ -1281,11 +1483,51 @@
/>
</div>
</el-dialog>
+
+ <!-- 浜鸿劯娉ㄥ唽 -->
+ <el-dialog
+ v-model="registerdialogVisible"
+ title="鎻掍欢閰嶇疆"
+ width="500"
+ :before-close="handleClose"
+ top="5vh"
+ >
+ <template #header="{ titleId }">
+ <div class="my-header">
+ <h2 :id="titleId" style="font-size: 2rem">浜鸿劯褰曞叆</h2>
+ </div>
+ </template>
+ <div class="content_register">
+ <div class="image-container">
+ <img
+ src="@/assets/login/headimg.jpg"
+ id="img"
+ style="width: 100%"
+ class="profile-image"
+ />
+ </div>
+ <div class="action-buttons" @click="begin(1)">
+ <a href="myapp://" class="btn face-register">
+ <i class="fas fa-user-plus"></i> 浜鸿劯褰曞叆</a
+ >
+ <button class="btn submit-data" @click="faceEnter()">
+ <i class="fas fa-paper-plane"></i> 鎻愪氦鏁版嵁
+ </button>
+ </div>
+ </div>
+ <template #footer>
+ <!-- <div class="dialog-footer">
+ <el-button type="primary" class="downloadreBtn" @click="download(2)"
+ >鎻愪氦閰嶇疆</el-button
+ >
+ </div> -->
+ </template>
+ </el-dialog>
</div>
</template>
<script setup>
import { ref, reactive, onMounted, toRef } from "vue";
-import { ElMessage, ElMessageBox } from "element-plus";
+import { ElMessage, ElMessageBox, ElLoading } from "element-plus";
import {
GetUserList,
AddUser,
@@ -1304,6 +1546,10 @@
AddUserUnit,
EditUserUnit,
DeleteUserUnit,
+ GetIPData,
+ AddIP,
+ EditIP,
+ DeleteIP,
} from "@/api/user";
import { useRouter } from "vue-router";
import { formatTime } from "@/utils/index.js";
@@ -1409,6 +1655,8 @@
const dialogVisible1 = ref(false);
//鐢ㄦ埛瑙掕壊鏂板缓
const dialogVisible2 = ref(false);
+//浜鸿劯娉ㄥ唽
+const registerdialogVisible = ref(false);
//绛涢�夋潯浠�
const userOptions = [
{
@@ -1631,6 +1879,19 @@
unitName: "",
};
};
+const resetForm4 = (formEl) => {
+ if (!formEl) return;
+ formEl.resetFields();
+ formip.value = {
+ creater: "",
+ createDate: "",
+ modifier: "",
+ modifyDate: "",
+ id: 0,
+ iPaddress: "",
+ addressname: "",
+ };
+};
const handlePictureCardPreview = (uploadFile) => {
dialogImageUrl.value = uploadFile.url;
@@ -1664,6 +1925,7 @@
// formUser.value.userteam = formUser.value.userteam + "缁�";
// }
formUser.value.isLeader = newRole.value.isLeader;
+ formUser.value.rolename = newRole.value.roleName;
UpdateUser(formUser.value).then((res) => {
ElMessage({ message: "淇敼鎴愬姛", type: "success" });
dialogVisible.value = false;
@@ -1828,6 +2090,19 @@
trigger: "blur",
},
});
+const ipRules = reactive({
+ iPaddress: {
+ required: true,
+ message: "璇疯緭鍏P鍦板潃",
+ trigger: "blur",
+ },
+ addressname: {
+ required: true,
+ message: "璇疯緭鍏ユ淇亾",
+ trigger: "blur",
+ },
+});
+
const formRole = ref({
roleName: "",
description: "",
@@ -1993,6 +2268,10 @@
Unittype.value = "鏂板缓";
UnitdialogVisible.value = true;
};
+const Addip = () => {
+ ipType.value = "鏂板缓";
+ dialogipVisible.value = true;
+};
//鑾峰彇鐢ㄦ埛鍗曚綅
const getUnit = () => {
const startTime = formatTime(queryForm.value.selectTime[0]);
@@ -2049,6 +2328,8 @@
} else if (isactive.value == 4) {
selectoptions.value = unitOptions;
getUnit();
+ } else if ((isactive.value = 5)) {
+ getIpData();
}
};
@@ -2071,11 +2352,18 @@
ids.value = [];
ids.value = val.map((item) => item.id);
};
+const IpSelectionChange = (val) => {
+ ids.value = [];
+ ids.value = val.map((item) => item.id);
+};
const deleteAll = () => {
- if (ids.value.includes(1)) {
- ElMessage({ message: "瓒呯骇绠＄悊鍛樹笉鑳藉垹闄�", type: "error" });
- return;
+ if (isactive.value == 1 || isactive.value == 2) {
+ if (ids.value.includes(1)) {
+ ElMessage({ message: "瓒呯骇绠＄悊鍛樹笉鑳藉垹闄�", type: "error" });
+ return;
+ }
}
+
if (ids.value.length == 0) {
ElMessage({ message: "璇烽�夋嫨瑕佸垹闄ょ殑鏁版嵁", type: "error" });
return;
@@ -2100,11 +2388,173 @@
ElMessage({ message: "鍒犻櫎鎴愬姛", type: "success" });
getUnit();
});
+ } else if (isactive.value == 5) {
+ DeleteIP(ids.value).then((res) => {
+ ElMessage({ message: "鍒犻櫎鎴愬姛", type: "success" });
+ getIpData();
+ });
}
};
// 绠＄悊 璺敱璺宠浆
const toDetail = (row) => {
router.push({ name: "permission", state: { info: JSON.stringify(row) } });
+};
+const interval = ref(null);
+const onloading = ref(null);
+const baseUrl = "http://192.168.1.103:9093";
+const token = ref("");
+const imgbase64 = ref("");
+let urlPlugin = baseUrl + "/api/UserFace/DownlodaFacePlugin";
+let urlPReg = baseUrl + "/api/UserFace/DownloadRegFile";
+
+const getData = (flag) => {
+ let url = "http://localhost:9298";
+ let xmlResquest = new XMLHttpRequest();
+ xmlResquest.open("post", url, true);
+ xmlResquest.onload = function (e) {
+ if (xmlResquest.status == 200) {
+ clearTimeout(interval.value);
+ imgbase64.value = xmlResquest.response;
+ if (flag == 2) {
+ const faceContainer = document.getElementById("face-recognition");
+ const faceIcon = faceContainer.querySelector(".face-icon");
+ const capturedFace = document.getElementById("captured-face");
+ capturedFace.src = "data:image/png;base64," + xmlResquest.response;
+ faceIcon.style.display = "none";
+ capturedFace.style.display = "block";
+ window.URL.revokeObjectURL(url);
+ faceRecognitionEvent();
+ return;
+ } else {
+ let img = document.getElementById("img");
+ img.src = "data:image/png;base64," + xmlResquest.response;
+ window.URL.revokeObjectURL(url);
+ // hideLoading();
+ onloading.value.close();
+ return;
+ }
+ }
+ // hideLoading();
+ onloading.value.close();
+ };
+
+ xmlResquest.send();
+};
+
+const begin = (flag) => {
+ if (interval.value) {
+ clearTimeout(interval.value);
+ }
+ onloading.value = ElLoading.service({
+ lock: true,
+ text: "姝ｅ湪澶勭悊涓�,璇风◢鍚�...",
+ background: "rgba(0, 0, 0, 0.7)",
+ });
+ interval.value = setInterval(() => {
+ getData(flag);
+ }, 10000);
+};
+
+function faceEnter() {
+ token.value = JSON.parse(localStorage.getItem("user")).token;
+ console.log(token.value);
+
+ let url = baseUrl + "/api/UserFace/faceEnter";
+ let xmlResquest = new XMLHttpRequest();
+ xmlResquest.open("post", url, true);
+ xmlResquest.setRequestHeader("Content-Type", "application/json");
+ xmlResquest.setRequestHeader("Authorization", "Bearer " + token.value);
+ xmlResquest.onload = function (e) {
+ img.src = "headimg.jpg";
+ if (xmlResquest.status == 200) {
+ let response = JSON.parse(xmlResquest.response);
+ if (response.status) {
+ ElMessage.success("浜鸿劯褰曞叆鎴愬姛,鍥剧墖鍚嶇О锛�" + response.data);
+ onloading.value.close();
+ registerdialogVisible.value = false;
+ // hideLoading();
+ } else {
+ ElMessage.error("浜鸿劯褰曞叆澶辫触锛岄敊璇俊鎭細" + response.message);
+ onloading.value.close();
+ registerdialogVisible.value = false;
+ // hideLoading();
+ }
+ } else {
+ ElMessage.error("鏁版嵁鎻愪氦澶辫触");
+ onloading.value.close();
+ registerdialogVisible.value = false;
+ }
+ };
+ xmlResquest.send(JSON.stringify({ Base64Image: imgbase64.value }));
+}
+const ipData = ref([]);
+const dialogipVisible = ref(false);
+const ipType = ref("鏂板缓");
+const formip = ref({
+ creater: "",
+ createDate: "",
+ modifier: "",
+ modifyDate: "",
+ id: 0,
+ iPaddress: "",
+ addressname: "",
+});
+const formipRef = ref(null);
+//鑾峰彇ip鏁版嵁
+const getIpData = () => {
+ // 鏌ヨ鏉′欢
+ const startTime = formatTime(queryForm.value.selectTime[0]);
+ const endTime = formatTime(queryForm.value.selectTime[1]);
+ const filter = [
+ {
+ name: queryForm.value.selectType,
+ value: queryForm.value.selectInput,
+ displayType: "like",
+ },
+ { name: "createDate", value: startTime, displayType: "ThanOrEqual" },
+ { name: "createDate", value: endTime, displayType: "LessOrEqual" },
+ ];
+ GetIPData({
+ ...pageQuery.value,
+ filter,
+ }).then((res) => {
+ ipData.value = res.rows;
+ pageTotal.value = res.total;
+ });
+};
+const Editip = (val) => {
+ ipType.value = "淇敼";
+ let obj = Object.assign({}, val);
+ formip.value = obj;
+ dialogipVisible.value = true;
+};
+//淇濆瓨ip
+const saveIp = async (formEl) => {
+ if (!formEl) return;
+ await formEl.validate((valid, fields) => {
+ if (valid) {
+ if (ipType.value == "淇敼") {
+ EditIP(formip.value).then((res) => {
+ ElMessage({ message: "淇敼鎴愬姛", type: "success" });
+ dialogipVisible.value = false;
+ getIpData();
+ });
+ } else {
+ formip.value.creater = JSON.parse(
+ localStorage.getItem("user")
+ ).userName;
+ formip.value.createDate = formatTime(new Date());
+
+ AddIP(formip.value).then((res) => {
+ ElMessage({ message: "娣诲姞鎴愬姛", type: "success" });
+ dialogipVisible.value = false;
+ getIpData();
+ });
+ }
+ } else {
+ console.log("error submit!", fields);
+ }
+ });
};
onMounted(() => {
@@ -2273,7 +2723,7 @@
flex-direction: column;
.checkbox {
- width: 35rem;
+ width: 45rem;
display: flex;
justify-content: space-between;
margin-top: 1rem;
@@ -2450,6 +2900,70 @@
}
}
}
+/* 娣诲姞瀛椾綋鍥炬爣搴� */
+.content_register {
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ padding: 30px;
+ background-color: #f8f9fa;
+ border-radius: 12px;
+ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
+ max-width: 800px;
+ margin: 0 auto;
+ .image-container {
+ margin-bottom: 25px;
+ border: 3px solid #e9ecef;
+ border-radius: 8px;
+ overflow: hidden;
+ }
+
+ .profile-image {
+ display: block;
+ width: 200px;
+ height: 360px;
+ object-fit: cover;
+ }
+
+ .action-buttons {
+ display: flex;
+ gap: 20px;
+ }
+
+ .btn,
+ a.btn {
+ padding: 12px 25px;
+ border: none;
+ border-radius: 50px;
+ font-size: 16px;
+ font-weight: 600;
+ cursor: pointer;
+ display: inline-flex;
+ align-items: center;
+ gap: 10px;
+ text-decoration: none;
+ color: white;
+ }
+
+ .face-register {
+ background-color: #4e73df;
+ }
+
+ .submit-data {
+ background-color: #1cc88a;
+ }
+
+ /* 纭繚a鏍囩鍙偣鍑诲尯鍩� */
+ .btn {
+ position: relative;
+ z-index: 1;
+ }
+
+ /* 娣诲姞鐐瑰嚮鍙嶉 */
+ .btn:active {
+ transform: scale(0.98);
+ }
+}
</style>
<style>
.confirmButtonClass {
--
Gitblit v1.9.3