163 lines
3.2 KiB
Vue
163 lines
3.2 KiB
Vue
<template>
|
|
<div class="user-manager">
|
|
<InPageLeftNav />
|
|
<div
|
|
class="table-area"
|
|
:class="{
|
|
'table-area-w': sidebar.opened,
|
|
'table-area-ws': !sidebar.opened,
|
|
}"
|
|
>
|
|
<SearchBarTop @emitFun="emitFun" />
|
|
<!-- 列表 -->
|
|
<base-table
|
|
:page="queryParams.pageNo"
|
|
:limit="queryParams.pageSize"
|
|
:table-props="tableProps"
|
|
:table-data="list"
|
|
:max-height="tableH"
|
|
>
|
|
<method-btn
|
|
v-if="tableBtn.length"
|
|
slot="handleBtn"
|
|
:width="120"
|
|
label="操作"
|
|
:method-list="tableBtn"
|
|
@clickBtn="handleClick"
|
|
/>
|
|
</base-table>
|
|
<pagination
|
|
:page.sync="queryParams.pageNo"
|
|
:limit.sync="queryParams.pageSize"
|
|
:total="total"
|
|
@pagination="getList"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from "vuex";
|
|
import InPageLeftNav from "./components/InPageLeftNav";
|
|
import SearchBarTop from "./components/SearchBarTop";
|
|
import tableHeightMixin from "@/mixins/tableHeightMixin";
|
|
import { listUser } from "@/api/system/user";
|
|
const tableProps = [
|
|
{
|
|
prop: "username",
|
|
label: "用户名",
|
|
minWidth: 120,
|
|
showOverflowtooltip: true,
|
|
},
|
|
{
|
|
prop: "email",
|
|
label: "邮箱",
|
|
minWidth: 150,
|
|
showOverflowtooltip: true,
|
|
},
|
|
{
|
|
prop: "mobile",
|
|
label: "手机号",
|
|
minWidth: 120,
|
|
},
|
|
{
|
|
prop: "deptName",
|
|
label: "组织",
|
|
minWidth: 120,
|
|
},
|
|
{
|
|
prop: "role",
|
|
label: "角色名称",
|
|
},
|
|
{
|
|
prop: "workno",
|
|
label: "工号",
|
|
},
|
|
{
|
|
prop: "status",
|
|
label: "状态",
|
|
},
|
|
{
|
|
prop: "remark",
|
|
label: "备注",
|
|
showOverflowtooltip: true,
|
|
},
|
|
];
|
|
export default {
|
|
name: "SystemPost",
|
|
components: { InPageLeftNav, SearchBarTop },
|
|
mixins: [tableHeightMixin],
|
|
computed: {
|
|
...mapGetters(["sidebar"]),
|
|
},
|
|
data() {
|
|
return {
|
|
// 查询参数
|
|
queryParams: {
|
|
pageNo: 1,
|
|
pageSize: 20,
|
|
name: null,
|
|
status: null,
|
|
planFinishTime: [],
|
|
},
|
|
total: 0,
|
|
tableProps,
|
|
list: [{ username: "111" }],
|
|
tableBtn: [
|
|
{
|
|
type: "authorization",
|
|
btnName: "授权",
|
|
},
|
|
{
|
|
type: "edit",
|
|
btnName: "编辑",
|
|
},
|
|
{
|
|
type: "delete",
|
|
btnName: "删除",
|
|
},
|
|
],
|
|
};
|
|
},
|
|
created() {
|
|
this.getList();
|
|
},
|
|
methods: {
|
|
/** 查询用户列表 */
|
|
getList() {
|
|
listUser(this.queryParams).then((response) => {
|
|
this.list = response.data.list;
|
|
this.total = response.data.total;
|
|
});
|
|
},
|
|
emitFun(val) {
|
|
if (val.btn === "onSearch") {
|
|
this.queryParams.pageNo = 1;
|
|
this.getList();
|
|
} else {
|
|
}
|
|
},
|
|
handleClick() {},
|
|
},
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.user-manager {
|
|
display: flex;
|
|
.table-area {
|
|
display: inline-block;
|
|
height: calc(100vh - 120px - 8px);
|
|
background-color: #fff;
|
|
margin-left: 8px;
|
|
border-radius: 8px;
|
|
padding: 8px;
|
|
}
|
|
.table-area-w {
|
|
width: calc(100vw - 542px);
|
|
}
|
|
.table-area-ws {
|
|
width: calc(100vw - 348px);
|
|
}
|
|
}
|
|
</style>
|