|
|
@@ -1,18 +1,14 @@
|
|
|
<template>
|
|
|
<PageMain class="vh100">
|
|
|
- <div class=" flex j-s">
|
|
|
- <div class="member-tree mr-4">
|
|
|
- <el-input v-model="filterText" style="width: 240px" placeholder="姓名，手机号，工号查询" :prefix-icon="Search">
|
|
|
+ <div class="flex j-s" style="height: 100%;">
|
|
|
+ <div class="member-tree mr-1">
|
|
|
+ <el-input v-model="filterText" style="width: 240px" placeholder="姓名，手机号，工号查询" >
|
|
|
<template #append>
|
|
|
- <el-button :icon="Search" @click="handleSearch" />
|
|
|
+ <el-button :icon="Search" link @click="handleSearch" />
|
|
|
</template>
|
|
|
</el-input>
|
|
|
<div style="display: flex;justify-content: space-between;margin: 10px 0;">
|
|
|
- <!-- <el-button type="primary" link @click="$router.push({path:'/personnel/institution'})">机构管理</el-button> -->
|
|
|
- <el-button type="primary" link @click="expandTree">
|
|
|
-
|
|
|
- {{ isExpand ? '全部收起' : '全部展开' }}
|
|
|
- </el-button>
|
|
|
+ <el-checkbox @change="expandTree" v-model="isExpand" :label="isExpand ? '全部收起' : '全部展开'" />
|
|
|
</div>
|
|
|
<el-tree ref="treeRef" style="max-width: 600px" class="filter-tree" :data="deptTreeData" :props="defaultProps"
|
|
|
:default-expand-all="isExpand" :filter-node-method="filterNode" :expand-on-click-node="false"
|
|
|
@@ -44,17 +40,32 @@
|
|
|
:showSelect="true" :pageInfo="pageInfo" @getList="getList" @selectionChange="selectChange"
|
|
|
:showOperation="true">
|
|
|
<template v-slot:table-title-btn>
|
|
|
- <div class="flex j-s">
|
|
|
- <div>
|
|
|
- <el-select v-model="status" style="width: 100px;" @change="statusChange()">
|
|
|
- <!-- status -->
|
|
|
- <el-option :label="'全部'" :value="'-1'"></el-option>
|
|
|
- <el-option v-for="item in statusList" :key="item.id" :label="item.label"
|
|
|
- :value="item.value"></el-option>
|
|
|
- </el-select>
|
|
|
- <el-button class="ml-2" @click="showAllMember()">展示全部成员</el-button>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
+ <el-form v-model="firstForm" >
|
|
|
+ <el-row :gutter="0">
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="状态">
|
|
|
+ <el-select v-model="firstForm.status">
|
|
|
+ <el-option :label="'全部'" :value="'-1'"></el-option>
|
|
|
+ <el-option v-for="item in statusList" :key="item.id" :label="item.label"
|
|
|
+ :value="item.value"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="成员信息" style="margin-left:6px">
|
|
|
+ <el-select v-model="firstForm.attrType" placeholder="请选择">
|
|
|
+ <el-option label="展示全部成员" value="1"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8" style="display: flex; align-items: start; justify-content: flex-end">
|
|
|
+ <el-button type="primary" @click="statusChange">搜索</el-button>
|
|
|
+ <el-button plain @click="showAllMember">重置</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ <div style="margin: 6px 0 24px;border-top: 1px dashed #EEEEEE; ;"></div>
|
|
|
+ <div >
|
|
|
<el-button type="primary" @click="add(ruleFormRef)">
|
|
|
<el-icon>
|
|
|
<Plus />
|
|
|
@@ -77,8 +88,6 @@
|
|
|
<el-button type="primary" :disabled="!deptItem.id" @click="manySetDeptUser()">
|
|
|
设置负责人</el-button>
|
|
|
</div>
|
|
|
-
|
|
|
- </div>
|
|
|
</template>
|
|
|
<template v-slot:operation="scope">
|
|
|
<el-button type="primary" link @click="editor(scope.operationData)">
|
|
|
@@ -207,7 +216,10 @@ onMounted(async () => {
|
|
|
|
|
|
//状态字典
|
|
|
const statusList = ref<dictType[]>([]);
|
|
|
-const status = ref('-1')
|
|
|
+const firstForm = ref({
|
|
|
+ status:'-1',
|
|
|
+ attrType:'1',
|
|
|
+})
|
|
|
//机构列表
|
|
|
|
|
|
type tableType = {
|
|
|
@@ -259,11 +271,6 @@ function treeClickTable(node: any) {
|
|
|
//全部展示机构树，或全部收起
|
|
|
const isExpand = ref(false)
|
|
|
function expandTree() {
|
|
|
- // console.log(treeRef.value)
|
|
|
-
|
|
|
-
|
|
|
- isExpand.value = !isExpand.value
|
|
|
- // treeRef.value!.defaultExpandAll=!isExpand.value;
|
|
|
const nodes = treeRef.value?.store._getAllNodes();
|
|
|
if (nodes) {
|
|
|
nodes.forEach((item: any) => item.expanded = isExpand.value);
|
|
|
@@ -360,7 +367,7 @@ const pageInfo = reactive({
|
|
|
show: true
|
|
|
});
|
|
|
function showAllMember() {
|
|
|
- status.value = ''
|
|
|
+ firstForm.value.status = ''
|
|
|
deptItem.value = {}
|
|
|
pageInfo.pageNum = 1;
|
|
|
pageInfo.pageSize = 10;
|
|
|
@@ -382,10 +389,10 @@ const getList = (item: PageInfo) => {
|
|
|
const getUserList = () => {
|
|
|
api.userApi.memberList({
|
|
|
...pageInfo,
|
|
|
+ ...firstForm.value,
|
|
|
pages: pageInfo.pageNum,
|
|
|
size: pageInfo.pageSize,
|
|
|
deptId: deptItem.value.id,
|
|
|
- status: status.value,
|
|
|
isMember: 1,
|
|
|
}).then((res: any) => {
|
|
|
|
|
|
@@ -726,6 +733,22 @@ function manySetDeptUser() {
|
|
|
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
+:deep(.el-input-group__append) {
|
|
|
+ background: linear-gradient( 91deg, #4FCAFF 0%, #2B62FF 100%);
|
|
|
+ color: #fff;
|
|
|
+ .el-button.is-link:not(.is-disabled):active{
|
|
|
+ color: #fff;
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+:deep(.el-table__inner-wrapper:before) {
|
|
|
+ display: none
|
|
|
+}
|
|
|
+:deep(.el-tree-node__content) {
|
|
|
+ height: 32px;
|
|
|
+ margin-bottom: 5px;
|
|
|
+}
|
|
|
:deep(.el-dropdown-link) {
|
|
|
cursor: pointer;
|
|
|
color: var(--el-color-primary);
|
|
|
@@ -733,7 +756,25 @@ function manySetDeptUser() {
|
|
|
align-items: center;
|
|
|
margin-left: 15px;
|
|
|
}
|
|
|
-
|
|
|
+.member-tree{
|
|
|
+ width: 278px;
|
|
|
+ height: 100%;
|
|
|
+ position: relative;
|
|
|
+ margin-right: 24px;
|
|
|
+ :deep(.el-checkbox__inner) {
|
|
|
+ border-radius: 50%
|
|
|
+ }
|
|
|
+ &::after{
|
|
|
+ content:'';
|
|
|
+ position:absolute;
|
|
|
+ height: calc(100% + 40px);
|
|
|
+ width: 1px;
|
|
|
+ background-color: #EEEEEE;
|
|
|
+ top: -20px;
|
|
|
+ right: 0;
|
|
|
+ bottom: -20px;
|
|
|
+ }
|
|
|
+}
|
|
|
.table {
|
|
|
flex: 1;
|
|
|
/* 占据剩余空间 */
|
