OMC/fe.ems.vue3
1
0
Fork 0
Code Issues Releases 3 Activity

部门管理代码还原

Browse Source
This commit is contained in:
lai
2024-06-18 18:31:41 +08:00
parent 197a962c0d
commit 1aa2f2382a
1 changed files with 116 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

228
src/views/system/dept/index.vue
View File

@@ -12,7 +12,7 @@ import {
addDept,
updateDept,
listDeptExcludeChild,
} from '@/api/system/tenant';
} from '@/api/system/dept';
import { parseDateToStr } from '@/utils/date-utils';
import { regExpMobile, regExpEmail } from '@/utils/regular-utils';
import useDictStore from '@/store/modules/dict';
@@ -33,7 +33,7 @@ let dict: {
/**查询参数 */
let queryParams = reactive({
/**部门名称 */
tenantName: '',
deptName: '',
/**部门状态 */
status: undefined,
});
@@ -41,14 +41,14 @@ let queryParams = reactive({
/**查询参数重置 */
function fnQueryReset() {
queryParams = Object.assign(queryParams, {
tenantName: '',
deptName: '',
status: undefined,
});
fnGetList();
}
/**表格全展开行key */
let expandedRowKeys: any[] = [];
let expandedRowKeys: string[] = [];
/**表格状态类型 */
type TabeStateType = {
@@ -80,34 +80,21 @@ let tableState: TabeStateType = reactive({
let tableColumns: ColumnsType = [
{
title: t('views.system.dept.className'),
dataIndex: 'tenantName',
dataIndex: 'deptName',
align: 'left',
width: 300,
},
{
title: t('views.system.dept.key'),
dataIndex: 'tenancyKey',
title: t('views.system.dept.classId'),
dataIndex: 'deptId',
align: 'left',
width: 200,
width: 150,
},
{
title: t('views.system.dept.type'),
dataIndex: 'tenancyType',
key: 'tenancyType',
align: 'center',
width: 150,
customRender(opt) {
switch (opt.value) {
case 'SD-SST':
return t('views.system.dept.SDSST');
case 'APN':
return t('views.system.dept.APN');
case 'IMSI':
return t('views.system.dept.IMSI');
default:
return '';
}
},
title: t('views.system.dept.classSort'),
dataIndex: 'orderNum',
align: 'left',
width: 200,
},
{
title: t('views.system.dept.status'),
@@ -116,7 +103,6 @@ let tableColumns: ColumnsType = [
align: 'center',
width: 150,
},
{
title: t('views.system.dept.createTime'),
dataIndex: 'createTime',
@@ -129,19 +115,11 @@ let tableColumns: ColumnsType = [
},
{
title: t('common.operate'),
key: 'tenantId',
key: 'deptId',
align: 'left',
},
];
const modalStateFromOption = reactive({
tenantType: [
{ label: t('views.system.dept.SDSST'), value: 'SD-SST' },
{ label: t('views.system.dept.APN'), value: 'APN' },
{ label: t('views.system.dept.IMSI'), value: 'IMSI' },
],
});
/**表格紧凑型变更操作 */
function fnTableSize({ key }: MenuInfo) {
tableState.size = key as SizeType;
@@ -182,17 +160,15 @@ let modalState: ModalStateType = reactive({
visibleByEdit: false,
title: '部门',
from: {
tenantId: undefined,
tenantName: '',
deptId: undefined,
deptName: '',
email: '',
leader: '',
orderNum: 0,
parentId: '',
parentId: '100',
ancestors: '',
parentName: null,
phone: '',
tenancyKey: '',
tenancyType: '',
status: '0',
},
confirmLoading: false,
@@ -209,7 +185,7 @@ const modalStateFrom = Form.useForm(
message: t('views.system.dept.highClass') + t('common.unableNull'),
},
],
tenantName: [
deptName: [
{
required: true,
min: 1,
@@ -217,35 +193,45 @@ const modalStateFrom = Form.useForm(
message: t('views.system.dept.className') + t('common.unableNull'),
},
],
email: [
{
required: false,
pattern: regExpEmail,
message: t('views.system.dept.emailTip'),
},
],
phone: [
{
required: false,
pattern: regExpMobile,
message: t('views.system.dept.phoneTip'),
},
],
})
);
/**
* 对话框弹出显示为 查看
* @param tenantId 部门编号id
* @param deptId 部门编号id
*/
function fnModalVisibleByVive(tenantId: string | number) {
if (!tenantId) {
function fnModalVisibleByVive(deptId: string | number) {
if (!deptId) {
message.error(t('common.getInfoFail'), 2);
return;
}
if (modalState.confirmLoading) return;
const hide = message.loading(t('common.loading'), 0);
modalState.confirmLoading = true;
getDept(tenantId).then(res => {
getDept(deptId).then(res => {
modalState.confirmLoading = false;
hide();
if (res.code === RESULT_CODE_SUCCESS && res.data) {
if (res.data.parentId === '0') {
modalState.treeData = [
{
tenantId: '0',
parentId: '0',
tenantName: t('views.system.dept.node'),
},
{ deptId: '0', parentId: '0', deptName: t('views.system.dept.node') },
];
} else {
//modalState.treeData = treeDataAll;
modalState.treeData = treeDataAll;
}
modalState.from = Object.assign(modalState.from, res.data);
modalState.title = t('views.system.dept.classInfo');
@@ -258,14 +244,14 @@ function fnModalVisibleByVive(tenantId: string | number) {
/**
* 对话框弹出显示为 新增或者修改
* @param tenantId 部门编号id, 不传为新增
* @param deptId 部门编号id, 不传为新增
* @param parentId 上级部门id
*/
function fnModalVisibleByEdit(
tenantId?: string | number,
deptId?: string | number,
parentId?: string | number
) {
if (!tenantId) {
if (!deptId) {
modalStateFrom.resetFields();
if (parentId) {
modalState.from.parentId = parentId;
@@ -278,7 +264,7 @@ function fnModalVisibleByEdit(
const hide = message.loading(t('common.loading'), 0);
modalState.confirmLoading = true;
// 获取部门信息同时查询部门列表（排除节点）
Promise.all([getDept(tenantId), listDeptExcludeChild(tenantId)])
Promise.all([getDept(deptId), listDeptExcludeChild(deptId)])
.then(resArr => {
if (resArr[0].code === RESULT_CODE_SUCCESS && resArr[0].data) {
modalState.from = Object.assign(modalState.from, resArr[0].data);
@@ -289,13 +275,13 @@ function fnModalVisibleByEdit(
if (resArr[1].data.length === 0) {
modalState.treeData = [
{
tenantId: '0',
deptId: '0',
parentId: '0',
tenantName: t('views.system.dept.node'),
deptName: t('views.system.dept.node'),
},
];
} else {
modalState.treeData = parseDataToTree(resArr[1].data, 'tenantId');
modalState.treeData = parseDataToTree(resArr[1].data, 'deptId');
}
}
modalState.title =
@@ -322,8 +308,7 @@ function fnModalOk() {
.then(() => {
modalState.confirmLoading = true;
const from = toRaw(modalState.from);
console.log('from', from);
const dept = from.tenantId ? updateDept(from) : addDept(from);
const dept = from.deptId ? updateDept(from) : addDept(from);
const hide = message.loading(t('common.loading'), 0);
dept
.then(res => {
@@ -334,7 +319,7 @@ function fnModalOk() {
});
modalState.visibleByEdit = false;
// 新增时清空上级部门树重新获取
if (!from.tenantId) {
if (!from.deptId) {
treeDataAll = [];
}
modalStateFrom.resetFields();
@@ -368,15 +353,15 @@ function fnModalCancel() {
/**
* 部门删除
* @param tenantId 部门编号id
* @param deptId 部门编号id
*/
function fnRecordDelete(tenantId: string | number) {
function fnRecordDelete(deptId: string | number) {
Modal.confirm({
title: t('common.tipTitle'),
content: t('views.system.dept.delSure', { tenantId: tenantId }),
content: t('views.system.dept.delSure', { deptId: deptId }),
onOk() {
const hide = message.loading(t('common.loading'), 0);
delDept(tenantId).then(res => {
delDept(deptId).then(res => {
hide();
if (res.code === RESULT_CODE_SUCCESS) {
message.success({
@@ -401,16 +386,13 @@ function fnGetList() {
tableState.loading = true;
listDept(toRaw(queryParams)).then(res => {
if (res.code === RESULT_CODE_SUCCESS && Array.isArray(res.data)) {
// 转换树状数据
const treeData = parseDataToTree(res.data, 'tenantId');
const treeData = parseDataToTree(res.data, 'deptId');
// 初始上级部门和展开编号key
if (treeDataAll.length <= 0) {
// 转换树状数据
treeDataAll = treeData;
// 展开编号key
expandedRowKeys = [
...new Set(res.data.map((item: any) => item.parentId)),
];
expandedRowKeys = [...new Set(res.data.map(item => item.parentId))];
fnTableExpandedRowsAll(tableState.expandedRowAll);
}
tableState.data = treeData;
@@ -444,10 +426,10 @@ onMounted(() => {
<a-col :lg="6" :md="12" :xs="24">
<a-form-item
:label="t('views.system.dept.className')"
name="tenantName"
name="deptName"
>
<a-input
v-model:value="queryParams.tenantName"
v-model:value="queryParams.deptName"
allow-clear
></a-input>
</a-form-item>
@@ -552,7 +534,7 @@ onMounted(() => {
<!-- 表格列表 -->
<a-table
class="table"
row-key="tenantId"
row-key="deptId"
:columns="tableColumns"
:loading="tableState.loading"
:data-source="tableState.data"
@@ -567,13 +549,13 @@ onMounted(() => {
<template v-if="column.key === 'status'">
<DictTag :options="dict.sysNormalDisable" :value="record.status" />
</template>
<template v-if="column.key === 'tenantId'">
<template v-if="column.key === 'deptId'">
<a-space :size="8" align="center">
<a-tooltip>
<template #title>{{ t('common.viewText') }}</template>
<a-button
type="link"
@click.prevent="fnModalVisibleByVive(record.tenantId)"
@click.prevent="fnModalVisibleByVive(record.deptId)"
v-perms:has="['system:dept:query']"
>
<template #icon><ProfileOutlined /></template>
@@ -583,7 +565,7 @@ onMounted(() => {
<template #title>{{ t('common.editText') }}</template>
<a-button
type="link"
@click.prevent="fnModalVisibleByEdit(record.tenantId)"
@click.prevent="fnModalVisibleByEdit(record.deptId)"
v-perms:has="['system:dept:edit']"
>
<template #icon><FormOutlined /></template>
@@ -593,7 +575,7 @@ onMounted(() => {
<template #title>{{ t('common.deleteText') }}</template>
<a-button
type="link"
@click.prevent="fnRecordDelete(record.tenantId)"
@click.prevent="fnRecordDelete(record.deptId)"
v-perms:has="['system:dept:remove']"
>
<template #icon><DeleteOutlined /></template>
@@ -606,7 +588,7 @@ onMounted(() => {
<a-button
type="link"
@click.prevent="
fnModalVisibleByEdit(undefined, record.tenantId)
fnModalVisibleByEdit(undefined, record.deptId)
"
v-perms:has="['system:dept:add']"
>
@@ -639,10 +621,10 @@ onMounted(() => {
:tree-data="modalState.treeData"
:field-names="{
children: 'children',
label: 'tenantName',
value: 'tenantId',
label: 'deptName',
value: 'deptId',
}"
tree-node-label-prop="tenantName"
tree-node-label-prop="deptName"
>
<template #suffixIcon></template>
</a-tree-select>
@@ -651,9 +633,9 @@ onMounted(() => {
<a-col :lg="12" :md="12" :xs="24">
<a-form-item
:label="t('views.system.dept.className')"
name="tenantName"
name="deptName"
>
{{ modalState.from.tenantName }}
{{ modalState.from.deptName }}
</a-form-item>
</a-col>
<a-col :lg="12" :md="12" :xs="24">
@@ -676,23 +658,30 @@ onMounted(() => {
</a-form-item>
</a-col>
<a-col :lg="12" :md="12" :xs="24">
<a-form-item
:label="t('views.system.dept.classId')"
name="tenantId"
>
{{ modalState.from.tenantId }}
<a-form-item :label="t('views.system.dept.classId')" name="deptId">
{{ modalState.from.deptId }}
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :lg="24" :md="24" :xs="24">
<a-form-item
:label="t('views.system.dept.type')"
name="type"
:label="t('views.system.dept.admin')"
name="leader"
:label-col="{ span: 3 }"
:labelWrap="true"
>
{{ modalState.from.tenancyType }}
{{ modalState.from.leader }}
</a-form-item>
</a-col>
<a-col :lg="12" :md="12" :xs="24">
<a-form-item :label="t('views.system.dept.phone')" name="phone">
{{ modalState.from.phone }}
</a-form-item>
</a-col>
<a-col :lg="12" :md="12" :xs="24">
<a-form-item :label="t('views.system.dept.email')" name="email">
{{ modalState.from.email }}
</a-form-item>
</a-col>
</a-row>
@@ -735,11 +724,11 @@ onMounted(() => {
:tree-data="modalState.treeData"
:field-names="{
children: 'children',
label: 'tenantName',
value: 'tenantId',
label: 'deptName',
value: 'deptId',
}"
tree-node-label-prop="tenantName"
tree-node-filter-prop="tenantName"
tree-node-label-prop="deptName"
tree-node-filter-prop="deptName"
style="width: 100%"
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
>
@@ -748,13 +737,13 @@ onMounted(() => {
<a-form-item
:label="t('views.system.dept.className')"
name="tenantName"
v-bind="modalStateFrom.validateInfos.tenantName"
name="deptName"
v-bind="modalStateFrom.validateInfos.deptName"
:label-col="{ span: 3 }"
:labelWrap="true"
>
<a-input
v-model:value="modalState.from.tenantName"
v-model:value="modalState.from.deptName"
allow-clear
:maxlength="30"
></a-input>
@@ -787,29 +776,43 @@ onMounted(() => {
</a-row>
<a-row :gutter="16">
<a-col :span="12">
<a-col :span="24">
<a-form-item
:label="t('views.system.dept.type')"
name="type"
:label="t('views.system.dept.admin')"
name="leader"
v-bind="modalStateFrom.validateInfos.leader"
:label-col="{ span: 3 }"
:labelWrap="true"
>
<a-select
v-model:value="modalState.from.tenancyType"
<a-input
v-model:value="modalState.from.leader"
allow-clear
:options="modalStateFromOption.tenantType"
>
</a-select>
></a-input>
</a-form-item>
</a-col>
<a-col :lg="24" :md="24" :xs="24">
<a-col :lg="12" :md="12" :xs="24">
<a-form-item
:label="t('views.system.dept.key')"
name="key"
:label-col="{ span: 3 }"
:label="t('views.system.dept.phone')"
name="phone"
v-bind="modalStateFrom.validateInfos.phone"
>
<a-input
v-model:value="modalState.from.tenancyKey"
v-model:value="modalState.from.phone"
allow-clear
:maxlength="11"
></a-input>
</a-form-item>
</a-col>
<a-col :lg="12" :md="12" :xs="24">
<a-form-item
:label="t('views.system.dept.email')"
name="email"
v-bind="modalStateFrom.validateInfos.email"
>
<a-input
v-model:value="modalState.from.email"
allow-clear
:maxlength="40"
></a-input>
</a-form-item>
</a-col>
@@ -819,4 +822,5 @@ onMounted(() => {
</PageContainer>
</template>
<style lang="less" scoped></style>
<style lang="less" scoped>
</style>