|
|
|
@ -1,16 +1,16 @@ |
|
|
|
<script setup> |
|
|
|
import {computed, onMounted, ref} from 'vue' |
|
|
|
import {ElMessage, ElMessageBox} from 'element-plus' |
|
|
|
import {InfoFilled} from '@element-plus/icons-vue' |
|
|
|
import { computed, onMounted, ref } from 'vue' |
|
|
|
import { ElMessage, ElMessageBox } from 'element-plus' |
|
|
|
import { InfoFilled } from '@element-plus/icons-vue' |
|
|
|
import _ from 'lodash' |
|
|
|
import request from '@/util/http' |
|
|
|
import API from '@/util/http' |
|
|
|
import {useAdminStore} from "@/store/index.js" |
|
|
|
import {storeToRefs} from "pinia" |
|
|
|
import {findMenuById, permissionMapping} from "@/utils/menuTreePermission.js" |
|
|
|
import { useAdminStore } from "@/store/index.js" |
|
|
|
import { storeToRefs } from "pinia" |
|
|
|
import { findMenuById, permissionMapping } from "@/utils/menuTreePermission.js" |
|
|
|
|
|
|
|
const adminStore = useAdminStore() |
|
|
|
const {adminData, menuTree} = storeToRefs(adminStore) |
|
|
|
const { adminData, menuTree } = storeToRefs(adminStore) |
|
|
|
|
|
|
|
// 表格数据 |
|
|
|
const tableData = ref([]) |
|
|
|
@ -47,23 +47,23 @@ const showStatusConfirm = (row, targetStatus) => { |
|
|
|
// 规则 |
|
|
|
const addUserRules = { |
|
|
|
account: [ |
|
|
|
{required: true, message: '请输入OA号', trigger: 'blur'}, |
|
|
|
{pattern: /^\d+$/, message: 'OA号必须为数字', trigger: 'blur'}, |
|
|
|
{max: 20, message: '长度不能超过20位', trigger: 'blur'} |
|
|
|
{ required: true, message: '请输入OA号', trigger: 'blur' }, |
|
|
|
{ pattern: /^\d+$/, message: 'OA号必须为数字', trigger: 'blur' }, |
|
|
|
{ max: 20, message: '长度不能超过20位', trigger: 'blur' } |
|
|
|
], |
|
|
|
name: [ |
|
|
|
{required: true, message: '请输入用户名', trigger: 'blur'}, |
|
|
|
{max: 20, message: '长度不能超过20位', trigger: 'blur'} |
|
|
|
{ required: true, message: '请输入用户名', trigger: 'blur' }, |
|
|
|
{ max: 20, message: '长度不能超过20位', trigger: 'blur' } |
|
|
|
], |
|
|
|
market: [ |
|
|
|
{required: true, message: '请选择所属地区', trigger: 'change'} |
|
|
|
{ required: true, message: '请选择所属地区', trigger: 'change' } |
|
|
|
], |
|
|
|
permission: [ |
|
|
|
{required: true, message: '请选择角色名称', trigger: 'change'} |
|
|
|
{ required: true, message: '请选择角色名称', trigger: 'change' } |
|
|
|
], |
|
|
|
postiton: [ |
|
|
|
{required: true, message: '请输入职位', trigger: 'blur'}, |
|
|
|
{max: 20, message: '长度不能超过20位', trigger: 'blur'} |
|
|
|
{ required: true, message: '请输入职位', trigger: 'blur' }, |
|
|
|
{ max: 20, message: '长度不能超过20位', trigger: 'blur' } |
|
|
|
], |
|
|
|
machineIds: [ |
|
|
|
{ |
|
|
|
@ -325,7 +325,7 @@ const Ref = ref(null) |
|
|
|
const permissionList = ref([]) |
|
|
|
const getRoles = async function () { |
|
|
|
try { |
|
|
|
const res = await API({url: '/role/selectAll'}) |
|
|
|
const res = await API({ url: '/role/selectAll' }) |
|
|
|
permissionList.value = res.data.map(item => ({ |
|
|
|
label: item.roleName, |
|
|
|
value: item.id |
|
|
|
@ -439,7 +439,7 @@ const getUserLists = async function (selectedRoleId) { |
|
|
|
parentRoleTip.value = ''; |
|
|
|
const parentRes = await request({ |
|
|
|
url: '/role/selectFather', |
|
|
|
data: {id: selectedRoleId} // 用选中的角色ID请求 |
|
|
|
data: { id: selectedRoleId } // 用选中的角色ID请求 |
|
|
|
}); |
|
|
|
const parentId = parentRes.data.fatherId; |
|
|
|
const parentName = parentRes.data.parentName; |
|
|
|
@ -457,7 +457,7 @@ const getUserLists = async function (selectedRoleId) { |
|
|
|
// } |
|
|
|
const res = await API({ |
|
|
|
url: '/menu/tree', |
|
|
|
data: {id: roleId} |
|
|
|
data: { id: roleId } |
|
|
|
}) |
|
|
|
data.value = processTreeData(res.data) |
|
|
|
permissionEditObj.value.checkedKeys = collectIds(res.data) || []; |
|
|
|
@ -472,11 +472,11 @@ const getUserLists = async function (selectedRoleId) { |
|
|
|
//编辑用户表单校验 |
|
|
|
const editAdminRules = { |
|
|
|
market: [ |
|
|
|
{required: true, message: '请选择所属地区', trigger: 'change'} |
|
|
|
{ required: true, message: '请选择所属地区', trigger: 'change' } |
|
|
|
], |
|
|
|
postiton: [ |
|
|
|
{required: true, message: '请输入职位', trigger: ['blur', 'change']}, |
|
|
|
{max: 20, message: '长度不能超过20位', trigger: ['blur', 'change']} |
|
|
|
{ required: true, message: '请输入职位', trigger: ['blur', 'change'] }, |
|
|
|
{ max: 20, message: '长度不能超过20位', trigger: ['blur', 'change'] } |
|
|
|
], |
|
|
|
machineIds: [ |
|
|
|
{ |
|
|
|
@ -501,7 +501,7 @@ const permissionEdit = async function () { |
|
|
|
ElMessage.error('无此权限') |
|
|
|
return |
|
|
|
} |
|
|
|
let {adminName: userName, roleName: oldRole, roleId: newRoleId} = permissionEditObj.value; |
|
|
|
let { adminName: userName, roleName: oldRole, roleId: newRoleId } = permissionEditObj.value; |
|
|
|
if (oldRole == null) { |
|
|
|
oldRole = '暂未分配角色' |
|
|
|
} |
|
|
|
@ -599,7 +599,7 @@ const editStatus = async function (row) { |
|
|
|
ElMessage.error('无此权限') |
|
|
|
return |
|
|
|
} |
|
|
|
const {id, account, targetStatus, ...restRow} = currentStatusRow.value |
|
|
|
const { id, account, targetStatus, ...restRow } = currentStatusRow.value |
|
|
|
|
|
|
|
try { |
|
|
|
statusLoading.value[id] = true |
|
|
|
@ -915,25 +915,24 @@ onMounted(async function () { |
|
|
|
<div class="head-card"> |
|
|
|
<div class="head-card-element"> |
|
|
|
<el-text class="mx-1" size="large">OA号：</el-text> |
|
|
|
<el-input v-model="admin.account" style="width: 240px" placeholder="请输入OA号" clearable/> |
|
|
|
<el-input v-model="admin.account" style="width: 240px" placeholder="请输入OA号" clearable /> |
|
|
|
</div> |
|
|
|
<div class="head-card-element" style="margin-left: 50px"> |
|
|
|
<el-text class="mx-1" size="large">所属地区：</el-text> |
|
|
|
<el-cascader v-model="admin.market" :options="marketsTree" placeholder="请选择所属地区" clearable |
|
|
|
style="width:180px" |
|
|
|
@change="handleMarketChange"/> |
|
|
|
<el-cascader v-model="admin.market" :options="marketsTree" placeholder="请选择所属地区" clearable style="width:180px" |
|
|
|
@change="handleMarketChange" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
<div class="head-card-element" style="margin-left: 50px"> |
|
|
|
<el-text class="mx-1" size="large">职位名称：</el-text> |
|
|
|
<el-select v-model="admin.postiton" placeholder="请选择职位名称" style="width: 240px" clearable> |
|
|
|
<el-option v-for="item in postiton" :key="item" :label="item" :value="item"/> |
|
|
|
<el-option v-for="item in postiton" :key="item" :label="item" :value="item" /> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="head-card-btn"> |
|
|
|
<el-button type="success" @click="reset()">重置</el-button> |
|
|
|
<el-button type="primary" @click="search()" v-if="canLook">查询</el-button> |
|
|
|
<el-button type="success" @click="reset()">重置</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-card> |
|
|
|
@ -955,13 +954,13 @@ onMounted(async function () { |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column prop="account" label="OA号"/> |
|
|
|
<el-table-column prop="name" label="姓名"/> |
|
|
|
<el-table-column prop="market" label="所属地区"/> |
|
|
|
<el-table-column prop="postiton" label="职位"/> |
|
|
|
<el-table-column prop="account" label="OA号" /> |
|
|
|
<el-table-column prop="name" label="姓名" /> |
|
|
|
<el-table-column prop="market" label="所属地区" /> |
|
|
|
<el-table-column prop="postiton" label="职位" /> |
|
|
|
<el-table-column prop="roleName" label="部门权限"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="remark" label="备注"/> |
|
|
|
<el-table-column prop="remark" label="备注" /> |
|
|
|
<el-table-column prop="operation" label="操作" width="280px"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-button type="warning" text :disabled="!canReset" @click="resetPassword(scope.row)" v-if="canReset"> |
|
|
|
@ -974,7 +973,7 @@ onMounted(async function () { |
|
|
|
<el-popconfirm title="确定将此用户删除吗？" @confirm="delConfirm"> |
|
|
|
<template #reference> |
|
|
|
<el-button type="danger" text @click="del(scope.row)" v-if="canDel" |
|
|
|
:disabled="!canDel ||scope.row.adminStatus === 0 || scope.row.account === adminData.account"> |
|
|
|
:disabled="!canDel || scope.row.adminStatus === 0 || scope.row.account === adminData.account"> |
|
|
|
删除 |
|
|
|
</el-button> |
|
|
|
</template> |
|
|
|
@ -995,14 +994,13 @@ onMounted(async function () { |
|
|
|
@change="(targetStatus) => showStatusConfirm(scope.row, targetStatus)" style=" |
|
|
|
--el-switch-on-color: #13ce66; |
|
|
|
--el-switch-off-color: #ff4949; |
|
|
|
" active-text="启用" inactive-text="禁用" inline-prompt/> |
|
|
|
" active-text="启用" inactive-text="禁用" inline-prompt /> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<div class="pagination" style="margin-top: 1vh;"> |
|
|
|
<el-pagination background :page-size="getObj.pageSize" :page-sizes="[5, 10, 20, 50, 100]" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" :total="total" |
|
|
|
@size-change="handlePageSizeChange" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handlePageSizeChange" |
|
|
|
@current-change="handleCurrentChange"></el-pagination> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -1016,19 +1014,17 @@ onMounted(async function () { |
|
|
|
<el-form ref="Ref" :rules="addUserRules" :model="addAdmin" label-width="auto" |
|
|
|
style="max-width: 600px; align-items: center"> |
|
|
|
<el-form-item prop="account" label="OA号:" required clearable> |
|
|
|
<el-input v-model="addAdmin.account" placeholder="请输入OA号" style="width: 220px"/> |
|
|
|
<el-input v-model="addAdmin.account" placeholder="请输入OA号" style="width: 220px" /> |
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
<el-form-item prop="name" label="用户名:" required clearable> |
|
|
|
<el-input v-model="addAdmin.name" placeholder="请输入用户名" style="width: 220px"/> |
|
|
|
<el-input v-model="addAdmin.name" placeholder="请输入用户名" style="width: 220px" /> |
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
<el-form-item prop="market" label="所属地区:" required clearable> |
|
|
|
<el-cascader v-model="addAdmin.market" :options="marketsTree" placeholder="请选择所属地区" clearable |
|
|
|
collapse-tags |
|
|
|
collapse-tags-tooltip style="width:220px" @change="handleMarketChangeAddUser" |
|
|
|
:max-collapse-tags="2" |
|
|
|
:props="addUserProps"/> |
|
|
|
<el-cascader v-model="addAdmin.market" :options="marketsTree" placeholder="请选择所属地区" clearable collapse-tags |
|
|
|
collapse-tags-tooltip style="width:220px" @change="handleMarketChangeAddUser" :max-collapse-tags="2" |
|
|
|
:props="addUserProps" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="permission" label="角色名称:" required> |
|
|
|
<el-select v-model="addAdmin.permission" placeholder="请选择角色名称" style="width: 220px" clearable> |
|
|
|
@ -1037,21 +1033,21 @@ onMounted(async function () { |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="postiton" label="职位:" required> |
|
|
|
<el-input v-model="addAdmin.postiton" placeholder="请输入职位" style="width: 220px" clearable/> |
|
|
|
<el-input v-model="addAdmin.postiton" placeholder="请输入职位" style="width: 220px" clearable /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="machineIds" label="机器码:" required> |
|
|
|
<div style="display: flex; align-items: center; flex-wrap: wrap; gap: 10px;"> |
|
|
|
<!-- 动态添加的机器码输入框 --> |
|
|
|
<div v-for="(item, index) in addAdmin.machineIds" :key="index"> |
|
|
|
<el-input v-model="addAdmin.machineIds[index]" placeholder="请输入机器码" |
|
|
|
style="width: 220px; margin-right: 10px;"/> |
|
|
|
style="width: 220px; margin-right: 10px;" /> |
|
|
|
</div> |
|
|
|
<el-button type="primary" @click="addMachineIdInput">添加</el-button> |
|
|
|
</div> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="remark" label="备注"> |
|
|
|
<el-input v-model="addAdmin.remark" style="width: 300px" :rows="2" maxlength="100" show-word-limit |
|
|
|
type="textarea"/> |
|
|
|
type="textarea" /> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
|
|
|
|
@ -1069,22 +1065,21 @@ onMounted(async function () { |
|
|
|
<el-form ref="Ref" :rules="editAdminRules" :model="permissionEditObj" label-width="auto" |
|
|
|
style="max-width: 600px; align-items: center"> |
|
|
|
<el-form-item prop="account" label="用户账号:" clearable> |
|
|
|
<el-input v-model="permissionEditObj.account" placeholder="请输入OA号" style="width: 220px" disabled/> |
|
|
|
<el-input v-model="permissionEditObj.account" placeholder="请输入OA号" style="width: 220px" disabled /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="name" label="用户名称:"> |
|
|
|
<el-input v-model="permissionEditObj.adminName" placeholder="请输入用户名" style="width: 220px" disabled/> |
|
|
|
<el-input v-model="permissionEditObj.adminName" placeholder="请输入用户名" style="width: 220px" disabled /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="market" label="所属地区:" clearable> |
|
|
|
<el-cascader v-model="permissionEditObj.market" :options="marketsTree" placeholder="请选择所属地区" clearable |
|
|
|
collapse-tags collapse-tags-tooltip style="width:220px" @change="handleMarketChangeEditUser" |
|
|
|
:max-collapse-tags="2" :props="editUserProps"/> |
|
|
|
:max-collapse-tags="2" :props="editUserProps" /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="postiton" label="职位:"> |
|
|
|
<el-input v-model="permissionEditObj.postiton" placeholder="请输入职位" style="width: 220px" clearable/> |
|
|
|
<el-input v-model="permissionEditObj.postiton" placeholder="请输入职位" style="width: 220px" clearable /> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="roleName" label="角色名称:"> |
|
|
|
<el-select v-model="permissionEditObj.roleId" placeholder="请选择角色" style="width: 220px" |
|
|
|
@change="getUserLists"> |
|
|
|
<el-select v-model="permissionEditObj.roleId" placeholder="请选择角色" style="width: 220px" @change="getUserLists"> |
|
|
|
<el-option v-for="item in permissionList" :key="item.value" :label="item.label" |
|
|
|
:value="item.value"></el-option> |
|
|
|
</el-select> |
|
|
|
@ -1092,15 +1087,14 @@ onMounted(async function () { |
|
|
|
<el-form-item prop="parentName" label="上级角色:"> |
|
|
|
<el-select v-model="permissionEditObj.parentId" placeholder="无上级角色" :disabled="!!parentRoleTip" |
|
|
|
style="width: 220px"> |
|
|
|
<el-option v-if="parentRoleTip" :key="0" :label="parentRoleTip" :value="null" disabled/> |
|
|
|
<el-option v-if="parentRoleTip" :key="0" :label="parentRoleTip" :value="null" disabled /> |
|
|
|
<el-option v-else v-for="item in permissionList" :key="item.value" :label="item.label" disabled |
|
|
|
:value="item.value"></el-option> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item prop="permissionSelect" label="权限列表:"> |
|
|
|
<el-tree v-if="data.length > 0" :data="data" :disabled="true" show-checkbox node-key="id" |
|
|
|
:props="{ label: 'menuName', children: 'children' }" |
|
|
|
:default-checked-keys="permissionEditObj.checkedKeys"> |
|
|
|
:props="{ label: 'menuName', children: 'children' }" :default-checked-keys="permissionEditObj.checkedKeys"> |
|
|
|
</el-tree> |
|
|
|
<div v-else style="display: flex; align-items: center; gap: 8px;"> |
|
|
|
<span style="color: #999;">暂无数据</span> |
|
|
|
@ -1111,7 +1105,7 @@ onMounted(async function () { |
|
|
|
<!-- 动态添加的机器码输入框 --> |
|
|
|
<div v-for="(item, index) in permissionEditObj.machineIds" :key="index"> |
|
|
|
<el-input v-model="permissionEditObj.machineIds[index]" placeholder="" |
|
|
|
style="width: 220px; margin-right: 10px;"/> |
|
|
|
style="width: 220px; margin-right: 10px;" /> |
|
|
|
</div> |
|
|
|
<el-button type="primary" @click="UseraddMachineIdInput">添加</el-button> |
|
|
|
</div> |
|
|
|
@ -1135,7 +1129,7 @@ onMounted(async function () { |
|
|
|
<el-row> |
|
|
|
<el-col :span="4" style="margin-top: 20px"> |
|
|
|
<el-icon class="dialog-icon" color="#10AEFF" size="50"> |
|
|
|
<InfoFilled/> |
|
|
|
<InfoFilled /> |
|
|
|
</el-icon> |
|
|
|
</el-col> |
|
|
|
<el-col :span="20"> |
|
|
|
@ -1152,17 +1146,14 @@ onMounted(async function () { |
|
|
|
</template> |
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
<el-dialog v-model="ackVisible" width="700px" |
|
|
|
:close-on-click-modal="false" |
|
|
|
:style="{ |
|
|
|
<el-dialog v-model="ackVisible" width="700px" :close-on-click-modal="false" :style="{ |
|
|
|
backgroundImage: 'url(/src/assets/SvgIcons/背景.svg', |
|
|
|
backgroundSize: 'cover', |
|
|
|
backgroundPosition: 'center', |
|
|
|
height:'400px' |
|
|
|
height: '400px' |
|
|
|
}" |
|
|
|
@close="() => { if (currentStatusRow) currentStatusRow.adminStatus = currentStatusRow.adminStatus === 1 ? 0 : 1 }"> |
|
|
|
<div class="status-confirm-content" |
|
|
|
> |
|
|
|
<div class="status-confirm-content"> |
|
|
|
将要{{ currentStatusRow?.adminStatus === 1 ? '禁用' : '启用' }}该用户 |
|
|
|
<br> |
|
|
|
</div> |
|
|
|
@ -1186,7 +1177,6 @@ onMounted(async function () { |
|
|
|
</template> |
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
|
|
|
|
|
// 搜索的卡片样式 |
|
|
|
.card1 { |
|
|
|
background: #F3FAFE; |
|
|
|
@ -1202,7 +1192,7 @@ onMounted(async function () { |
|
|
|
:deep(.el-table__header-wrapper), |
|
|
|
:deep(.el-table__body-wrapper), |
|
|
|
:deep(.el-table__cell), |
|
|
|
/* 表格 */ |
|
|
|
/* 表格 */ |
|
|
|
:deep(.el-table__body td) { |
|
|
|
background-color: #F3FAFE !important; |
|
|
|
} |
|
|
|
|
lihui
2 months ago