perf(用户管理模块): 分页查询改为部门树查询
This commit is contained in:
parent
bae90b97b7
commit
00515c683c
@ -14,7 +14,8 @@ export default mergeConfig(
|
||||
proxy: {
|
||||
'/api': {
|
||||
// target: 'http://8.134.75.234:8081',
|
||||
target: 'http://192.168.3.238:8081',
|
||||
// target: 'http://192.168.3.238:8081',
|
||||
target: 'http://localhost:8081',
|
||||
changeOrigin: true,
|
||||
},
|
||||
},
|
||||
|
||||
@ -11,6 +11,12 @@ export interface DeptRecord extends DeptCreateRecord {
|
||||
id: string;
|
||||
}
|
||||
|
||||
export interface DeptTreeData {
|
||||
id: number;
|
||||
label: string;
|
||||
children?: DeptTreeData[];
|
||||
}
|
||||
|
||||
// 获取部门树
|
||||
export function getAllDeptTree(id?: number | string) {
|
||||
return axios({
|
||||
|
||||
110
src/views/system/user/components/dept-tree.vue
Normal file
110
src/views/system/user/components/dept-tree.vue
Normal file
@ -0,0 +1,110 @@
|
||||
<template>
|
||||
<a-input-search
|
||||
v-model="searchKey"
|
||||
placeholder="搜索"
|
||||
style="margin-bottom: 8px; max-width: 240px"
|
||||
/>
|
||||
<a-tree
|
||||
:data="treeData"
|
||||
:field-names="{
|
||||
key: 'id',
|
||||
title: 'name',
|
||||
children: 'children',
|
||||
}"
|
||||
@select="handleSelected"
|
||||
>
|
||||
<template #label="nodeData">
|
||||
<template v-if="getMatchIndex(nodeData?.label) < 0">{{ nodeData?.label }}</template>
|
||||
<span v-else>
|
||||
{{ nodeData?.title?.slice(0, index) }}
|
||||
<span style="color: var(--color-primary-light-4);">
|
||||
{{ nodeData?.title?.slice(index, index + searchKey.length) }}
|
||||
</span>
|
||||
{{ nodeData?.title?.slice(index + searchKey.length) }}
|
||||
</span>
|
||||
</template>
|
||||
</a-tree>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {computed, ref} from "vue";
|
||||
import { DeptTreeData,getAllDeptTree } from '@/api/dept';
|
||||
import useLoading from "@/hooks/loading";
|
||||
|
||||
const deptOptions = ref<DeptTreeData[]>([]);
|
||||
const searchKey = ref("");
|
||||
const {loading, setLoading} = useLoading(true);
|
||||
const emit = defineEmits(["select"]);
|
||||
|
||||
// 获取部门树
|
||||
const fetchDeptData = async () => {
|
||||
setLoading(true);
|
||||
try {
|
||||
const {data} = await getAllDeptTree(0);
|
||||
deptOptions.value = data;
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
fetchDeptData();
|
||||
|
||||
// 获取展开节点 (默认展开两个层级)
|
||||
const getExpandedKeys = computed(() => {
|
||||
const result: number[] = [];
|
||||
deptOptions.value.forEach((it: DeptTreeData) => {
|
||||
result.push(it.id);
|
||||
if (it.children && it.children.length > 0) {
|
||||
it.children.forEach((itc: DeptTreeData) => {
|
||||
result.push(itc.id);
|
||||
});
|
||||
}
|
||||
});
|
||||
return result;
|
||||
});
|
||||
|
||||
function searchData(keyword: string) {
|
||||
const loop = (data: DeptTreeData[]) => {
|
||||
const result: DeptTreeData[] = [];
|
||||
data.forEach((item: DeptTreeData) => {
|
||||
if (item.label.toLowerCase().indexOf(keyword.toLowerCase()) > -1) {
|
||||
result.push({...item});
|
||||
} else if (item.children) {
|
||||
const filterData = loop(item.children);
|
||||
if (filterData.length) {
|
||||
result.push({
|
||||
...item,
|
||||
children: filterData
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
return result;
|
||||
};
|
||||
return loop(deptOptions.value);
|
||||
}
|
||||
|
||||
const treeData = computed(() => {
|
||||
if (!searchKey.value) return deptOptions.value;
|
||||
return searchData(searchKey.value);
|
||||
});
|
||||
|
||||
function getMatchIndex(title: string) {
|
||||
if (!searchKey.value) return -1;
|
||||
return title.toLowerCase().indexOf(searchKey.value.toLowerCase());
|
||||
}
|
||||
|
||||
const handleSelected = (id: number[]) => {
|
||||
emit("select", id);
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: "DeptTree"
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -145,7 +145,7 @@ import { computed, PropType, ref } from 'vue';
|
||||
import { CreateRecord } from '@/api/user';
|
||||
import { FormInstance } from '@arco-design/web-vue/es/form';
|
||||
import { queryRoleList } from '@/api/role';
|
||||
import { deptList } from '@/api/dept';
|
||||
import { deptList, getAllDeptTree } from '@/api/dept';
|
||||
import { Message } from '@arco-design/web-vue';
|
||||
import { useUserStore } from '@/store';
|
||||
|
||||
@ -184,8 +184,8 @@ const userStore = useUserStore();
|
||||
// 部门数据
|
||||
const deptOptions = ref();
|
||||
const getDeptData = async () => {
|
||||
const res = await deptList();
|
||||
deptOptions.value = res.data.records;
|
||||
const res = await getAllDeptTree(0);
|
||||
deptOptions.value = res.data;
|
||||
};
|
||||
// 角色数据
|
||||
const roleOptions = ref();
|
||||
|
||||
@ -1,224 +1,245 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<Breadcrumb :items="['系统管理', '用户管理']" />
|
||||
<a-card class="general-card" title=" ">
|
||||
<a-row>
|
||||
<a-col :flex="1">
|
||||
<a-form
|
||||
:model="formModel"
|
||||
:label-col-props="{ span: 6 }"
|
||||
:wrapper-col-props="{ span: 18 }"
|
||||
label-align="right"
|
||||
>
|
||||
<a-row :gutter="18">
|
||||
<a-col :span="9">
|
||||
<a-form-item
|
||||
field="username"
|
||||
:label="$t('searchTable.form.username')"
|
||||
>
|
||||
<a-input
|
||||
v-model="formModel.username"
|
||||
:placeholder="$t('searchTable.form.username.placeholder')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-row>
|
||||
<a-col :span="5">
|
||||
<a-card style="margin-right: 10px;">
|
||||
<DeptTree @select="handleSelectDept"/>
|
||||
<!-- <a-input-search :style="{marginBottom:'10px'}" placeholder="搜索"/>-->
|
||||
<!-- <a-tree-->
|
||||
<!-- :data="deptTreeData"-->
|
||||
<!-- :default-expand-all="true"-->
|
||||
<!-- :field-names="{ title: 'name', key: 'id', children: 'children' }"-->
|
||||
<!-- style="margin-bottom: 8px; max-width: 240px"-->
|
||||
<!-- @select="handleClickTree"-->
|
||||
<!-- @check="handleCheckTree"-->
|
||||
<!-- >-->
|
||||
<!-- </a-tree>-->
|
||||
|
||||
<a-col :span="9">
|
||||
<a-form-item
|
||||
field="phone"
|
||||
:label="$t('searchTable.form.phone')"
|
||||
>
|
||||
<a-input
|
||||
v-model="formModel.phone"
|
||||
:placeholder="$t('searchTable.form.phone.placeholder')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="9">
|
||||
<a-form-item
|
||||
field="email"
|
||||
:label="$t('searchTable.form.email')"
|
||||
>
|
||||
<a-input
|
||||
v-model="formModel.email"
|
||||
:placeholder="$t('searchTable.form.email.placeholder')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="9">
|
||||
<a-form-item
|
||||
field="enable"
|
||||
:label="$t('searchTable.form.status')"
|
||||
>
|
||||
<a-select
|
||||
v-model="formModel.enable"
|
||||
:options="statusOptions"
|
||||
:placeholder="$t('searchTable.form.status.placeholder')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-col>
|
||||
<a-divider style="height: 84px" direction="vertical" />
|
||||
<a-col :flex="'86px'" style="text-align: right">
|
||||
<a-space direction="vertical" :size="18">
|
||||
<a-button type="primary" @click="search">
|
||||
<template #icon>
|
||||
<icon-search />
|
||||
</template>
|
||||
{{ $t('searchTable.form.search') }}
|
||||
</a-button>
|
||||
<a-button @click="reset">
|
||||
<template #icon>
|
||||
<icon-refresh />
|
||||
</template>
|
||||
{{ $t('searchTable.form.reset') }}
|
||||
</a-button>
|
||||
</a-space>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-card>
|
||||
</a-col>
|
||||
<a-col :span="19">
|
||||
<a-card class="general-card" title=" ">
|
||||
<a-row>
|
||||
<a-col :flex="1">
|
||||
<a-form
|
||||
:model="formModel"
|
||||
:label-col-props="{ span: 6 }"
|
||||
:wrapper-col-props="{ span: 18 }"
|
||||
label-align="right"
|
||||
>
|
||||
<a-row :gutter="18">
|
||||
<a-col :span="9">
|
||||
<a-form-item
|
||||
field="username"
|
||||
:label="$t('searchTable.form.username')"
|
||||
>
|
||||
<a-input
|
||||
v-model="formModel.username"
|
||||
:placeholder="$t('searchTable.form.username.placeholder')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
|
||||
<a-divider style="margin-top: 0" />
|
||||
<a-row>
|
||||
<a-col :span="12">
|
||||
<a-space>
|
||||
<UserEdit ref="createUserRef" :is-create="true" @refresh="search" />
|
||||
</a-space>
|
||||
<a-button style="margin-left: 20px" @click="generateExcel">
|
||||
<template #icon>
|
||||
<icon-download size="18" />
|
||||
</template>
|
||||
{{ $t('searchTable.operation.download') }}
|
||||
</a-button>
|
||||
</a-col>
|
||||
<a-col
|
||||
:span="12"
|
||||
style="
|
||||
<a-col :span="9">
|
||||
<a-form-item
|
||||
field="phone"
|
||||
:label="$t('searchTable.form.phone')"
|
||||
>
|
||||
<a-input
|
||||
v-model="formModel.phone"
|
||||
:placeholder="$t('searchTable.form.phone.placeholder')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="9">
|
||||
<a-form-item
|
||||
field="email"
|
||||
:label="$t('searchTable.form.email')"
|
||||
>
|
||||
<a-input
|
||||
v-model="formModel.email"
|
||||
:placeholder="$t('searchTable.form.email.placeholder')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="9">
|
||||
<a-form-item
|
||||
field="enableState"
|
||||
:label="$t('searchTable.form.status')"
|
||||
>
|
||||
<a-select
|
||||
v-model="formModel.enableState"
|
||||
:options="statusOptions"
|
||||
:placeholder="$t('searchTable.form.status.placeholder')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
</a-col>
|
||||
<a-divider style="height: 84px" direction="vertical" />
|
||||
<a-col :flex="'86px'" style="text-align: right">
|
||||
<a-space direction="vertical" :size="18">
|
||||
<a-button type="primary" @click="search">
|
||||
<template #icon>
|
||||
<icon-search />
|
||||
</template>
|
||||
{{ $t('searchTable.form.search') }}
|
||||
</a-button>
|
||||
<a-button @click="reset">
|
||||
<template #icon>
|
||||
<icon-refresh />
|
||||
</template>
|
||||
{{ $t('searchTable.form.reset') }}
|
||||
</a-button>
|
||||
</a-space>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<a-divider style="margin-top: 0" />
|
||||
<a-row>
|
||||
<a-col :span="12">
|
||||
<a-space>
|
||||
<UserEdit ref="createUserRef" :is-create="true" @refresh="search" />
|
||||
</a-space>
|
||||
<a-button style="margin-left: 20px" @click="generateExcel">
|
||||
<template #icon>
|
||||
<icon-download size="18" />
|
||||
</template>
|
||||
{{ $t('searchTable.operation.download') }}
|
||||
</a-button>
|
||||
</a-col>
|
||||
<a-col
|
||||
:span="12"
|
||||
style="
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: end;
|
||||
padding-bottom: 20px;
|
||||
"
|
||||
>
|
||||
<a-tooltip :content="$t('searchTable.actions.refresh')">
|
||||
<div class="action-icon" @click="search">
|
||||
<icon-refresh size="18" />
|
||||
</div>
|
||||
</a-tooltip>
|
||||
|
||||
<a-dropdown @select="handleSelectDensity">
|
||||
<a-tooltip :content="$t('searchTable.actions.density')">
|
||||
<div class="action-icon"><icon-line-height size="18" /></div>
|
||||
</a-tooltip>
|
||||
<template #content>
|
||||
<a-doption
|
||||
v-for="item in densityList"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
:class="{ active: item.value === size }"
|
||||
>
|
||||
<span>{{ item.name }}</span>
|
||||
</a-doption>
|
||||
</template>
|
||||
</a-dropdown>
|
||||
|
||||
<a-tooltip :content="$t('searchTable.actions.columnSetting')">
|
||||
<a-popover
|
||||
trigger="click"
|
||||
position="bl"
|
||||
@popup-visible-change="popupVisibleChange"
|
||||
>
|
||||
<div class="action-icon"><icon-settings size="18" /></div>
|
||||
<template #content>
|
||||
<div id="tableSetting">
|
||||
<div
|
||||
v-for="(item, index) in showColumns"
|
||||
:key="item.dataIndex"
|
||||
class="setting"
|
||||
<a-tooltip :content="$t('searchTable.actions.refresh')">
|
||||
<div class="action-icon" @click="search">
|
||||
<icon-refresh size="18" />
|
||||
</div>
|
||||
</a-tooltip>
|
||||
|
||||
<a-dropdown @select="handleSelectDensity">
|
||||
<a-tooltip :content="$t('searchTable.actions.density')">
|
||||
<div class="action-icon"><icon-line-height size="18" /></div>
|
||||
</a-tooltip>
|
||||
<template #content>
|
||||
<a-doption
|
||||
v-for="item in densityList"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
:class="{ active: item.value === size }"
|
||||
>
|
||||
<div style="margin-right: 4px; cursor: move">
|
||||
<icon-drag-arrow />
|
||||
</div>
|
||||
<div>
|
||||
<a-checkbox
|
||||
v-model="item.checked"
|
||||
@change="
|
||||
<span>{{ item.name }}</span>
|
||||
</a-doption>
|
||||
</template>
|
||||
</a-dropdown>
|
||||
|
||||
<a-tooltip :content="$t('searchTable.actions.columnSetting')">
|
||||
<a-popover
|
||||
trigger="click"
|
||||
position="bl"
|
||||
@popup-visible-change="popupVisibleChange"
|
||||
>
|
||||
<div class="action-icon"><icon-settings size="18" /></div>
|
||||
<template #content>
|
||||
<div id="tableSetting">
|
||||
<div
|
||||
v-for="(item, index) in showColumns"
|
||||
:key="item.dataIndex"
|
||||
class="setting"
|
||||
>
|
||||
<div style="margin-right: 4px; cursor: move">
|
||||
<icon-drag-arrow />
|
||||
</div>
|
||||
<div>
|
||||
<a-checkbox
|
||||
v-model="item.checked"
|
||||
@change="
|
||||
handleChange($event, item as TableColumnData, index)
|
||||
"
|
||||
>
|
||||
</a-checkbox>
|
||||
>
|
||||
</a-checkbox>
|
||||
</div>
|
||||
<div class="title">
|
||||
{{ item.title === '#' ? '序列号' : item.title }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title">
|
||||
{{ item.title === '#' ? '序列号' : item.title }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</a-popover>
|
||||
</a-tooltip>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</template>
|
||||
</a-popover>
|
||||
</a-tooltip>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
<a-table
|
||||
row-key="id"
|
||||
:loading="loading"
|
||||
:pagination="false"
|
||||
:columns="(cloneColumns as TableColumnData[])"
|
||||
:data="renderData"
|
||||
:bordered="false"
|
||||
:size="size"
|
||||
style="margin-bottom: 40px"
|
||||
:filter-icon-align-left="alignLeft"
|
||||
@change="handleSortChange"
|
||||
@page-change="onPageChange"
|
||||
>
|
||||
<template #index="{ rowIndex }">
|
||||
{{ rowIndex + 1 + (pagination.current - 1) * pagination.size }}
|
||||
</template>
|
||||
<template #enabled="{ record }">
|
||||
<a-switch
|
||||
:model-value="record.enabled"
|
||||
:checked-value="true"
|
||||
:unchecked-value="false"
|
||||
@change="enabledStatus(record)"
|
||||
/>
|
||||
</template>
|
||||
<template #operations="{ record }">
|
||||
<UserEdit
|
||||
ref="editUserRef"
|
||||
:prem="record"
|
||||
:is-create="false"
|
||||
@refresh="fetchData"
|
||||
/>
|
||||
<!-- <Userc-->
|
||||
<!-- ref="editUserRef"-->
|
||||
<!-- :user="record"-->
|
||||
<!-- :is-create="false"-->
|
||||
<!-- @refresh="search"-->
|
||||
<!-- />-->
|
||||
<!-- <a-popconfirm
|
||||
content="确认删除此用户?"
|
||||
type="error"
|
||||
@ok="handleDelete(record)"
|
||||
<a-table
|
||||
row-key="id"
|
||||
:loading="loading"
|
||||
:pagination="true"
|
||||
:columns="(cloneColumns as TableColumnData[])"
|
||||
:data="renderData"
|
||||
:bordered="false"
|
||||
:size="size"
|
||||
style="margin-bottom: 40px"
|
||||
:filter-icon-align-left="alignLeft"
|
||||
@change="handleSortChange"
|
||||
@page-change="onPageChange"
|
||||
>
|
||||
<a-button type="primary" status="danger" size="small">
|
||||
删除
|
||||
</a-button>
|
||||
</a-popconfirm> -->
|
||||
</template>
|
||||
</a-table>
|
||||
<a-pagination
|
||||
style="float: right; position: relative; right: 1px; bottom: 25px"
|
||||
:total="pagination.total"
|
||||
:size="size"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
@page-size-change="onSizeChange"
|
||||
@change="onPageChange"
|
||||
/>
|
||||
</a-card>
|
||||
<template #index="{ rowIndex }">
|
||||
{{ rowIndex + 1 + (pagination.current - 1) * pagination.size }}
|
||||
</template>
|
||||
<template #enableState="{ record }">
|
||||
<a-switch
|
||||
:model-value="record.enableState"
|
||||
:checked-value="true"
|
||||
:unchecked-value="false"
|
||||
@change="enabledStatus(record)"
|
||||
/>
|
||||
</template>
|
||||
<template #operations="{ record }">
|
||||
<UserEdit
|
||||
ref="editUserRef"
|
||||
:prem="record"
|
||||
:is-create="false"
|
||||
@refresh="fetchData"
|
||||
/>
|
||||
<!-- <Userc-->
|
||||
<!-- ref="editUserRef"-->
|
||||
<!-- :user="record"-->
|
||||
<!-- :is-create="false"-->
|
||||
<!-- @refresh="search"-->
|
||||
<!-- />-->
|
||||
<!-- <a-popconfirm
|
||||
content="确认删除此用户?"
|
||||
type="error"
|
||||
@ok="handleDelete(record)"
|
||||
>
|
||||
<a-button type="primary" status="danger" size="small">
|
||||
删除
|
||||
</a-button>
|
||||
</a-popconfirm> -->
|
||||
</template>
|
||||
</a-table>
|
||||
<!-- <a-pagination
|
||||
style="float: right; position: relative; right: 1px; bottom: 25px"
|
||||
:total="pagination.total"
|
||||
:size="size"
|
||||
show-total
|
||||
show-jumper
|
||||
show-page-size
|
||||
@page-size-change="onSizeChange"
|
||||
@change="onPageChange"
|
||||
/>-->
|
||||
</a-card>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -227,6 +248,7 @@
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import useLoading from '@/hooks/loading';
|
||||
import { UserRecord, UserParams } from '@/api/user';
|
||||
import { getAllDeptTree } from '@/api/dept';
|
||||
import { Pagination } from '@/types/global';
|
||||
import type { SelectOptionData } from '@arco-design/web-vue/es/select/interface';
|
||||
import type { TableColumnData } from '@arco-design/web-vue/es/table/interface';
|
||||
@ -235,6 +257,7 @@ import { Message } from '@arco-design/web-vue';
|
||||
import { downloadExcel, DownloadExcelPrams } from '@/utils/excel';
|
||||
import useTableOption from '@/hooks/table-option';
|
||||
import UserEdit from './components/user-edit.vue';
|
||||
import DeptTree from './components/dept-tree.vue';
|
||||
|
||||
const generateFormModel = () => {
|
||||
return {
|
||||
@ -243,7 +266,8 @@ const generateFormModel = () => {
|
||||
phone: '',
|
||||
email: '',
|
||||
createdTime: [],
|
||||
enable: '',
|
||||
enableState: '',
|
||||
deptId: '',
|
||||
};
|
||||
};
|
||||
|
||||
@ -314,8 +338,8 @@ const columns = computed<TableColumnData[]>(() => [
|
||||
},
|
||||
{
|
||||
title: t('userTable.columns.enabled'),
|
||||
dataIndex: 'enabled',
|
||||
slotName: 'enabled',
|
||||
dataIndex: 'enableState',
|
||||
slotName: 'enableState',
|
||||
},
|
||||
{
|
||||
title: t('searchTable.columns.operations'),
|
||||
@ -333,6 +357,7 @@ const statusOptions = computed<SelectOptionData[]>(() => [
|
||||
value: 'false',
|
||||
},
|
||||
]);
|
||||
const deptTreeData = ref<any[]>([]);
|
||||
|
||||
// 获取用户列表
|
||||
const fetchData = async (
|
||||
@ -353,6 +378,14 @@ const fetchData = async (
|
||||
}
|
||||
};
|
||||
|
||||
// 获取部门树
|
||||
const getDeptTree = async () => {
|
||||
const res = await getAllDeptTree(0);
|
||||
if (res.status === 200) {
|
||||
deptTreeData.value = res.data;
|
||||
}
|
||||
}
|
||||
|
||||
// 下载表格
|
||||
const generateExcel = () => {
|
||||
const param: DownloadExcelPrams = {
|
||||
@ -363,7 +396,7 @@ const generateExcel = () => {
|
||||
{ title: '部门Id', key: 'deptId' },
|
||||
{ title: '角色Id', key: 'roleId' },
|
||||
{ title: 'email', key: 'email' },
|
||||
{ title: '启用状态', key: 'enabled' },
|
||||
{ title: '启用状态', key: 'enableState' },
|
||||
],
|
||||
rows: renderData.value,
|
||||
name: '用户表格',
|
||||
@ -374,7 +407,7 @@ const generateExcel = () => {
|
||||
// 查询
|
||||
const search = () => {
|
||||
fetchData({
|
||||
...pagination,
|
||||
// ...pagination,
|
||||
...formModel.value,
|
||||
} as unknown as UserParams);
|
||||
};
|
||||
@ -394,6 +427,7 @@ const onSizeChange = (size: number) => {
|
||||
|
||||
onMounted(() => {
|
||||
search();
|
||||
// getDeptTree()
|
||||
})
|
||||
|
||||
// 重置
|
||||
@ -407,7 +441,7 @@ const handleSortChange = (data: any, extra: any, currentDataSource: any) => {};
|
||||
|
||||
// 是否启用
|
||||
const enabledStatus = async (record: any) => {
|
||||
record.enabled = !record.enabled;
|
||||
record.enableState = !record.enableState;
|
||||
const res = await userStore.enabledUser(record.id);
|
||||
if (res.status === 200) {
|
||||
Message.success({
|
||||
@ -421,6 +455,22 @@ const enabledStatus = async (record: any) => {
|
||||
});
|
||||
}
|
||||
};
|
||||
const generateQueryParams = () => {
|
||||
return {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
userName: undefined,
|
||||
phonenumber: undefined,
|
||||
status: undefined,
|
||||
deptId: undefined,
|
||||
params: undefined,
|
||||
};
|
||||
};
|
||||
const handleSelectDept = (id: any[]) => {
|
||||
const [deptId] = id;
|
||||
formModel.value.deptId = deptId;
|
||||
search();
|
||||
}
|
||||
|
||||
// 删除
|
||||
// const handleDelete = async (record: UserRecord) => {
|
||||
@ -442,7 +492,6 @@ export default {
|
||||
name: 'User',
|
||||
};
|
||||
</script>
|
||||
<!--1-->
|
||||
<style scoped lang="less">
|
||||
.container {
|
||||
padding: 0 20px 20px 20px;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user