zianxin/pj_admin_cloud
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:人脸管理

Browse Source
This commit is contained in:
dzc committed 2024-12-31 12:32:13 +08:00
1 parent ffe6ba4390
commit fce1603a2e
5 files changed
+257 -33
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/api/admin/userFace.ts
+49
View File
@@ -0,0 +1,49 @@
import request from "/@/utils/request"
export function pageJoin(query?: Object) {
return request({
url: '/admin/user-face/page-join',
method: 'get',
params: query
})
}
export function fetchList(query?: Object) {
return request({
url: '/admin/user-face/page',
method: 'get',
params: query
})
}
export function addObj(obj?: Object) {
return request({
url: '/admin/user-face',
method: 'post',
data: obj
})
}
export function getObj(id?: string) {
return request({
url: '/admin/user-face/' + id,
method: 'get'
})
}
export function delObjs(ids?: Object) {
return request({
url: '/admin/user-face',
method: 'delete',
data: ids
})
}
export function putObj(obj?: Object) {
return request({
url: '/admin/user-face',
method: 'put',
data: obj
})
}
src/i18n/pages/form/zh-cn.ts
+1
View File
@@ -1,6 +1,7 @@
// 定义通用内容
export default {
common: {
confirmTitle: '警告',
queryBtn: '查询',
addBtn: '新 增',
editBtn: '修 改',
src/views/admin/system/user/face-manage.vue
+164
View File
@@ -0,0 +1,164 @@
<template>
<div class="system-user-dialog-container">
<el-dialog :close-on-click-modal="false" title="人脸管理" draggable v-model="dialogVisible">
<el-button icon="folder-add" type="primary" @click="addFace">
新增
</el-button>
<div class="h-4" />
<el-table v-loading="state.loading" :data="state.dataList" row-key="userId" border
:cell-style="tableStyle.cellStyle" :header-cell-style="tableStyle.headerCellStyle">
<el-table-column prop="username" align="center" label="用户名" />
<el-table-column prop="date" align="center" label="人脸">
<template #default="{ row }">
<preview-image :src="row.faceImg" />
</template>
</el-table-column>
<el-table-column prop="address" align="center" label="操作">
<template #default="{ row }">
<el-button link type="primary" @click="editFace(row)">
<Icon icon="ep:edit" />修改
</el-button>
<el-button link type="danger" @click="delFace(row)">
删除
</el-button>
</template>
</el-table-column>
</el-table>
<template #footer>
<el-button @click="submitForm" type="primary">确 定</el-button>
<el-button @click="dialogVisible = false">取 消</el-button>
</template>
</el-dialog>
<el-dialog v-model="uploadDialogVisible" :close-on-click-modal="false" :title="faceUploadTitle" width="30%"
@close="uploadDialogClone">
<el-form v-loading="formLoading" ref="formRef" :model="formData" :rules="formRules" label-width="80px">
<el-form-item label="人脸" prop="uploadFace">
<upload-img v-model:image-url="formData.uploadFace" />
</el-form-item>
</el-form>
<template #footer>
<el-button @click="submitFace" type="primary" :disabled="formLoading">确 定</el-button>
<el-button @click="uploadDialogVisible = false">取 消</el-button>
</template>
</el-dialog>
</div>
</template>
<script lang="ts" setup name="face-manage">
import { BasicTableProps, useTable } from '/@/hooks/table';
import * as userFaceApi from "/@/api/admin/userFace"
import { useMessage } from '/@/hooks/message';
// 定义刷新表格emit
const emit = defineEmits(['refresh']);
// 定义变量内容
const formRef = ref()
const dialogVisible = ref(false)
const uploadDialogVisible = ref(false)
const faceUploadTitle = ref<"上传人脸" | "修改人脸">("上传人脸")
const formLoading = ref(false)
const faceTableLoading = ref(false)
const formData = ref<any>({
id: undefined,
uploadFace: undefined,
})
const detailId = ref<any>(null)
// 定义表格查询、后台调用的API
const state: BasicTableProps = reactive<BasicTableProps>({
queryForm: {
deptId: '',
username: '',
phone: '',
},
pageList: userFaceApi.pageJoin,
});
const { getDataList, currentChangeHandle, sizeChangeHandle, downBlobFile, tableStyle } = useTable(state);
const formRules = reactive({
uploadFace: [{ required: true, message: '请上传人脸', trigger: 'blur' }],
})
const submitForm = async () => {
dialogVisible.value = false
emit('refresh')
}
const addFace = (row: any) => {
faceUploadTitle.value = "上传人脸"
formData.value.uploadFace = ""
uploadDialogVisible.value = true
}
const editFace = (row: any) => {
faceUploadTitle.value = "修改人脸"
formData.value.id = row.id
formData.value.uploadFace = row.faceImg
uploadDialogVisible.value = true
}
const delFace = async (row: any) => {
try {
await useMessage().delConfirm('是否删除人脸?')
userFaceApi.delObjs(row.id)
useMessage().success("删除成功")
getDataList()
} catch (error) {
console.log(error);
}
}
const openDialog = async (id: number) => {
if (!id) return;
dialogVisible.value = true
resetForm()
detailId.value = id
getDataList()
}
const submitFace = async () => {
if (!formRef) return
const valid = await formRef.value.validate()
if (!valid) return
formLoading.value = true
const pa: any = {
userId: detailId.value,
faceImg: formData.value.uploadFace,
}
if (faceUploadTitle.value == "修改人脸") {
pa.id = formData.value.id
}
try {
const fc = faceUploadTitle.value == "上传人脸" ? userFaceApi.addObj : userFaceApi.putObj
await fc(pa)
useMessage().success("操作成功")
uploadDialogClone()
getDataList()
} catch (error) {
console.log(error);
} finally {
formLoading.value = false
}
}
const uploadDialogClone = () => {
uploadDialogVisible.value = false
resetForm()
}
const resetForm = () => {
formData.value = {
id: undefined,
uploadFace: undefined,
}
formRef.value?.resetFields()
}
defineExpose({ openDialog })
</script>
src/views/admin/system/user/form.vue
+33 -32
View File
@@ -1,16 +1,19 @@
<template>
<div class="system-user-dialog-container">
<el-dialog :close-on-click-modal="false" :title="dataForm.userId ? $t('common.editBtn') : $t('common.addBtn')" draggable v-model="visible">
<el-dialog :close-on-click-modal="false" :title="dataForm.userId ? $t('common.editBtn') : $t('common.addBtn')"
draggable v-model="visible">
<el-form :model="dataForm" :rules="dataRules" label-width="90px" ref="dataFormRef" v-loading="loading">
<el-row :gutter="20">
<el-col :span="12" class="mb20">
<el-form-item :label="$t('sysuser.username')" prop="username">
<el-input :disabled="dataForm.userId !== ''" placeholder="请输入用户名" v-model="dataForm.username"></el-input>
<el-input :disabled="dataForm.userId !== ''" placeholder="请输入用户名"
v-model="dataForm.username"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item :label="$t('sysuser.password')" prop="password">
<el-input clearable placeholder="请输入密码" type="password" v-model="dataForm.password"></el-input>
<el-input clearable placeholder="请输入密码" type="password"
v-model="dataForm.password"></el-input>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
@@ -26,28 +29,24 @@
<el-col :span="12" class="mb20">
<el-form-item :label="$t('sysuser.role')" prop="role">
<el-select clearable multiple placeholder="请选择角色" v-model="dataForm.role">
<el-option :key="item.roleId" :label="item.roleName" :value="item.roleId" v-for="item in roleData" />
<el-option :key="item.roleId" :label="item.roleName" :value="item.roleId"
v-for="item in roleData" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item :label="$t('sysuser.post')" prop="post">
<el-select clearable multiple placeholder="请选择岗位" v-model="dataForm.post">
<el-option :key="item.postId" :label="item.postName" :value="item.postId" v-for="item in postData" />
<el-option :key="item.postId" :label="item.postName" :value="item.postId"
v-for="item in postData" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item :label="$t('sysuser.dept')" prop="deptId">
<el-tree-select
:data="deptData"
:props="{ value: 'id', label: 'name', children: 'children' }"
check-strictly
class="w100"
clearable
placeholder="请选择所属部门"
v-model="dataForm.deptId"
>
<el-tree-select :data="deptData"
:props="{ value: 'id', label: 'name', children: 'children' }" check-strictly
class="w100" clearable placeholder="请选择所属部门" v-model="dataForm.deptId">
</el-tree-select>
</el-form-item>
</el-col>
@@ -65,7 +64,8 @@
<el-col :span="12" class="mb20">
<el-form-item :label="$t('sysuser.lockFlag')" prop="lockFlag">
<el-radio-group v-model="dataForm.lockFlag">
<el-radio :key="index" :label="item.value" border v-for="(item, index) in lock_flag">{{ item.label }} </el-radio>
<el-radio :key="index" :label="item.value" border v-for="(item, index) in lock_flag">{{
item.label }} </el-radio>
</el-radio-group>
</el-form-item>
</el-col>
@@ -74,7 +74,8 @@
<template #footer>
<span class="dialog-footer">
<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
<el-button @click="onSubmit" type="primary" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
<el-button @click="onSubmit" type="primary" :disabled="loading">{{ $t('common.confirmButtonText')
}}</el-button>
</span>
</template>
</el-dialog>
@@ -107,10 +108,10 @@ const postData = ref<any[]>([]);
const loading = ref(false);
const props = defineProps({
deptId: {
type: String,
default: '',
}
deptId: {
type: String,
default: '',
}
});
const dataForm = reactive({
@@ -155,7 +156,7 @@ const dataRules = ref({
],
// 姓名校验，不能为空、只能是中文
name: [
{ validator: rule.overLength, trigger: 'blur' },
{ validator: rule.overLength, trigger: 'blur' },
{ required: true, message: '姓名不能为空', trigger: 'blur' },
{ validator: rule.chinese, trigger: 'blur' },
],
@@ -173,7 +174,7 @@ const dataRules = ref({
trigger: 'blur',
},
],
email: [{ type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] },{ validator: rule.overLength, trigger: 'blur' }],
email: [{ type: 'email', message: '请输入正确的邮箱地址', trigger: ['blur', 'change'] }, { validator: rule.overLength, trigger: 'blur' }],
lockFlag: [{ required: true, message: '状态不能为空', trigger: 'blur' }],
});
@@ -202,7 +203,7 @@ const openDialog = async (id: string) => {
// 提交
const onSubmit = async () => {
const valid = await dataFormRef.value.validate().catch(() => {});
const valid = await dataFormRef.value.validate().catch(() => { });
if (!valid) return false;
try {
@@ -263,9 +264,9 @@ const getDeptData = () => {
deptTree().then((res) => {
deptData.value = res.data;
// 默认选择在树中选中的部门
if (!dataForm.userId) {
dataForm.deptId = props.deptId;
}
if (!dataForm.userId) {
dataForm.deptId = props.deptId;
}
});
};
@@ -274,9 +275,9 @@ const getPostData = () => {
postList().then((res) => {
postData.value = res.data;
// 默认选择第一个
if (!dataForm.userId) {
dataForm.post = [res.data[0].postId];
}
if (!dataForm.userId) {
dataForm.post = [res.data[0].postId];
}
});
};
// 角色数据
@@ -284,9 +285,9 @@ const getRoleData = () => {
roleList().then((res) => {
roleData.value = res.data;
// 默认选择第一个
if (!dataForm.userId) {
dataForm.role = [res.data[0].roleId];
}
if (!dataForm.userId) {
dataForm.role = [res.data[0].roleId];
}
});
};
src/views/admin/system/user/index.vue
+10 -1
View File
@@ -89,7 +89,7 @@
active-value="0" inactive-value="9"></el-switch>
</template>
</el-table-column>
<el-table-column :label="$t('common.action')" width="200" fixed="right">
<el-table-column :label="$t('common.action')" width="300" fixed="right">
<template #default="scope">
<div style="display: flex">
<!-- 重置密码 -->
@@ -106,6 +106,11 @@
@click="userDialogRef.openDialog(scope.row.userId)">
{{ $t('common.editBtn') }}
</el-button>
<!-- 人脸管理 -->
<el-button icon="User" text type="primary"
@click="faceManageRef.openDialog(scope.row.userId)">
人脸管理
</el-button>
<!-- 删除用户 -->
<el-tooltip :content="$t('sysuser.deleteDisabledTip')"
:disabled="scope.row.userId !== '1'" placement="top">
@@ -129,6 +134,8 @@
<user-form ref="userDialogRef" @refresh="getDataList(false)" :deptId="state.queryForm.deptId" />
<face-manage ref="faceManageRef" @refresh="getDataList(false)" />
<upload-excel ref="excelUploadRef" :title="$t('sysuser.importUserTip')"
temp-url="/admin/sys-file/local/file/user.xlsx" url="/admin/user/import" @refreshDataList="getDataList" />
</div>
@@ -143,6 +150,7 @@ import { useI18n } from 'vue-i18n';
// 动态引入组件
const UserForm = defineAsyncComponent(() => import('./form.vue'));
const FaceManage = defineAsyncComponent(() => import('./face-manage.vue'));
const QueryTree = defineAsyncComponent(() => import('/@/components/QueryTree/index.vue'));
const PopoverInput = defineAsyncComponent(() => import('/@/components/PopoverInput/index.vue'));
@@ -150,6 +158,7 @@ const { t } = useI18n();
// 定义变量内容
const userDialogRef = ref();
const faceManageRef = ref();
const excelUploadRef = ref();
const queryRef = ref();
const showSearch = ref(true);