|
@@ -13,26 +13,26 @@
|
|
<div class="page-form-title-box">
|
|
<div class="page-form-title-box">
|
|
<el-form :model="leftQueryParams" class="form-box" ref="queryForm"
|
|
<el-form :model="leftQueryParams" class="form-box" ref="queryForm"
|
|
:inline="true" style="width:100%;">
|
|
:inline="true" style="width:100%;">
|
|
- <el-form-item label="" prop="queryParamsData1">
|
|
|
|
|
|
+ <el-form-item label="" prop="searchValue">
|
|
<el-input
|
|
<el-input
|
|
maxLength="30"
|
|
maxLength="30"
|
|
- v-model="leftQueryParams.queryParamsData1"
|
|
|
|
- placeholder="搜索姓名/学号/手机号/实验室"
|
|
|
|
|
|
+ v-model="leftQueryParams.searchValue"
|
|
|
|
+ placeholder="搜索姓名/学号/手机号"
|
|
style="width: 220px"
|
|
style="width: 220px"
|
|
/>
|
|
/>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item label="" prop="queryParamsData3">
|
|
|
|
- <el-select v-model="leftQueryParams.queryParamsData2" placeholder="部门" style="width: 140px">
|
|
|
|
|
|
+ <el-form-item label="" prop="deptId">
|
|
|
|
+ <el-select v-model="leftQueryParams.deptId" placeholder="部门" style="width: 140px">
|
|
<el-option
|
|
<el-option
|
|
v-for="dict in sectionOptionList"
|
|
v-for="dict in sectionOptionList"
|
|
- :key="dict.value"
|
|
|
|
- :label="dict.label"
|
|
|
|
- :value="dict.value"
|
|
|
|
|
|
+ :key="dict.deptId"
|
|
|
|
+ :label="dict.deptName"
|
|
|
|
+ :value="dict.deptId"
|
|
/>
|
|
/>
|
|
</el-select>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item label="" prop="queryParamsData3">
|
|
|
|
- <el-select v-model="leftQueryParams.queryParamsData3" placeholder="类型" style="width: 100px">
|
|
|
|
|
|
+ <el-form-item label="" prop="userType">
|
|
|
|
+ <el-select v-model="leftQueryParams.userType" placeholder="类型" style="width: 100px">
|
|
<el-option
|
|
<el-option
|
|
v-for="dict in classOptionList"
|
|
v-for="dict in classOptionList"
|
|
:key="dict.value"
|
|
:key="dict.value"
|
|
@@ -48,9 +48,9 @@
|
|
<div class="page-content-box">
|
|
<div class="page-content-box">
|
|
<el-table class="table-box" border :data="leftDataList" @selection-change="userChangeLeft" :row-key="getRowKeys">
|
|
<el-table class="table-box" border :data="leftDataList" @selection-change="userChangeLeft" :row-key="getRowKeys">
|
|
<el-table-column type="selection" width="50" :reserve-selection="true" align="center"/>
|
|
<el-table-column type="selection" width="50" :reserve-selection="true" align="center"/>
|
|
- <el-table-column label="姓名" prop="name" show-overflow-tooltip/>
|
|
|
|
- <el-table-column label="联系电话" prop="phone" width="150" show-overflow-tooltip/>
|
|
|
|
- <el-table-column label="所在部门" prop="section" width="220" show-overflow-tooltip/>
|
|
|
|
|
|
+ <el-table-column label="姓名" prop="userName" show-overflow-tooltip/>
|
|
|
|
+ <el-table-column label="联系电话" prop="mobile" width="150" show-overflow-tooltip/>
|
|
|
|
+ <el-table-column label="所在部门" prop="deptName" width="220" show-overflow-tooltip/>
|
|
</el-table>
|
|
</el-table>
|
|
<pagination :page-sizes="[10, 20]"
|
|
<pagination :page-sizes="[10, 20]"
|
|
v-show="leftTotal>0"
|
|
v-show="leftTotal>0"
|
|
@@ -63,38 +63,38 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="user-dialog-max-center-box">
|
|
<div class="user-dialog-max-center-box">
|
|
- <p class="el-icon-arrow-right"></p>
|
|
|
|
- <p class="el-icon-arrow-left"></p>
|
|
|
|
|
|
+ <p class="el-icon-arrow-right" @click="userAdd"></p>
|
|
|
|
+ <p class="el-icon-arrow-left" @click="userDel"></p>
|
|
</div>
|
|
</div>
|
|
<div class="user-dialog-max-right-box">
|
|
<div class="user-dialog-max-right-box">
|
|
<div class="title-top-box">
|
|
<div class="title-top-box">
|
|
<p>待选人员</p>
|
|
<p>待选人员</p>
|
|
- <p>{{rightCheckNum}}/{{rightMaxUserNum}}</p>
|
|
|
|
|
|
+ <p>{{rightCheckNum}}/{{userList.length}}</p>
|
|
</div>
|
|
</div>
|
|
<div class="table-max-big-box">
|
|
<div class="table-max-big-box">
|
|
<div class="page-form-title-box">
|
|
<div class="page-form-title-box">
|
|
<el-form :model="rightQueryParams" class="form-box" ref="queryForm"
|
|
<el-form :model="rightQueryParams" class="form-box" ref="queryForm"
|
|
:inline="true" style="width:100%;">
|
|
:inline="true" style="width:100%;">
|
|
- <el-form-item label="" prop="queryParamsData1">
|
|
|
|
|
|
+ <el-form-item label="" prop="searchValue">
|
|
<el-input
|
|
<el-input
|
|
maxLength="30"
|
|
maxLength="30"
|
|
- v-model="rightQueryParams.queryParamsData1"
|
|
|
|
- placeholder="搜索姓名/学号/手机号/实验室"
|
|
|
|
|
|
+ v-model="rightQueryParams.searchValue"
|
|
|
|
+ placeholder="搜索姓名/学号/手机号"
|
|
style="width: 220px"
|
|
style="width: 220px"
|
|
/>
|
|
/>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item label="" prop="queryParamsData3">
|
|
|
|
- <el-select v-model="rightQueryParams.queryParamsData2" placeholder="部门" style="width: 140px">
|
|
|
|
|
|
+ <el-form-item label="" prop="deptId">
|
|
|
|
+ <el-select v-model="rightQueryParams.deptId" placeholder="部门" style="width: 140px">
|
|
<el-option
|
|
<el-option
|
|
v-for="dict in sectionOptionList"
|
|
v-for="dict in sectionOptionList"
|
|
- :key="dict.value"
|
|
|
|
- :label="dict.label"
|
|
|
|
- :value="dict.value"
|
|
|
|
|
|
+ :key="dict.deptId"
|
|
|
|
+ :label="dict.deptName"
|
|
|
|
+ :value="dict.deptId"
|
|
/>
|
|
/>
|
|
</el-select>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
- <el-form-item label="" prop="queryParamsData3">
|
|
|
|
- <el-select v-model="rightQueryParams.queryParamsData3" placeholder="类型" style="width: 100px">
|
|
|
|
|
|
+ <el-form-item label="" prop="userType">
|
|
|
|
+ <el-select v-model="rightQueryParams.userType" placeholder="类型" style="width: 100px">
|
|
<el-option
|
|
<el-option
|
|
v-for="dict in classOptionList"
|
|
v-for="dict in classOptionList"
|
|
:key="dict.value"
|
|
:key="dict.value"
|
|
@@ -110,9 +110,9 @@
|
|
<div class="page-content-box">
|
|
<div class="page-content-box">
|
|
<el-table class="table-box" border :data="rightDataList" @selection-change="userChangeRight" :row-key="getRowKeys">
|
|
<el-table class="table-box" border :data="rightDataList" @selection-change="userChangeRight" :row-key="getRowKeys">
|
|
<el-table-column type="selection" width="50" :reserve-selection="true" align="center"/>
|
|
<el-table-column type="selection" width="50" :reserve-selection="true" align="center"/>
|
|
- <el-table-column label="姓名" prop="name" show-overflow-tooltip/>
|
|
|
|
- <el-table-column label="联系电话" prop="phone" width="150" show-overflow-tooltip/>
|
|
|
|
- <el-table-column label="所在部门" prop="section" width="220" show-overflow-tooltip/>
|
|
|
|
|
|
+ <el-table-column label="姓名" prop="userName" show-overflow-tooltip/>
|
|
|
|
+ <el-table-column label="联系电话" prop="mobile" width="150" show-overflow-tooltip/>
|
|
|
|
+ <el-table-column label="所在部门" prop="deptName" width="220" show-overflow-tooltip/>
|
|
</el-table>
|
|
</el-table>
|
|
<pagination :page-sizes="[10, 20]"
|
|
<pagination :page-sizes="[10, 20]"
|
|
v-show="rightTotal>0"
|
|
v-show="rightTotal>0"
|
|
@@ -135,7 +135,7 @@
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
-
|
|
|
|
|
|
+ import { systemUserSelect,getDeptDropList } from "@/api/commonality/permission";
|
|
export default {
|
|
export default {
|
|
name: 'addDialog',
|
|
name: 'addDialog',
|
|
props:{
|
|
props:{
|
|
@@ -144,18 +144,19 @@
|
|
data(){
|
|
data(){
|
|
return{
|
|
return{
|
|
userDialogType:false,
|
|
userDialogType:false,
|
|
|
|
+ userList:[],
|
|
//左侧数据
|
|
//左侧数据
|
|
leftQueryParams:{
|
|
leftQueryParams:{
|
|
page:1,
|
|
page:1,
|
|
pageSize:20,
|
|
pageSize:20,
|
|
- leftQueryParamsData1:null,
|
|
|
|
- leftQueryParamsData2:null,
|
|
|
|
- leftQueryParamsData3:null,
|
|
|
|
|
|
+ searchValue:'',
|
|
|
|
+ deptId:'',
|
|
|
|
+ userType:'',
|
|
},
|
|
},
|
|
leftDataList:[
|
|
leftDataList:[
|
|
{userId:'1',name:'名称',phone:'电话',section:'部门1'}
|
|
{userId:'1',name:'名称',phone:'电话',section:'部门1'}
|
|
],
|
|
],
|
|
- leftTotal:10,
|
|
|
|
|
|
+ leftTotal:0,
|
|
leftCheckNum:0,
|
|
leftCheckNum:0,
|
|
leftMaxUserNum:0,
|
|
leftMaxUserNum:0,
|
|
leftCheckUserIds:[],
|
|
leftCheckUserIds:[],
|
|
@@ -163,14 +164,14 @@
|
|
rightQueryParams:{
|
|
rightQueryParams:{
|
|
page:1,
|
|
page:1,
|
|
pageSize:20,
|
|
pageSize:20,
|
|
- rightQueryParamsData1:null,
|
|
|
|
- rightQueryParamsData2:null,
|
|
|
|
- rightQueryParamsData3:null,
|
|
|
|
|
|
+ searchValue:'',
|
|
|
|
+ deptId:'',
|
|
|
|
+ userType:'',
|
|
},
|
|
},
|
|
rightDataList:[
|
|
rightDataList:[
|
|
{userId:'12',name:'名称',phone:'电话',section:'部门1'}
|
|
{userId:'12',name:'名称',phone:'电话',section:'部门1'}
|
|
],
|
|
],
|
|
- rightTotal:10,
|
|
|
|
|
|
+ rightTotal:0,
|
|
rightCheckNum:0,
|
|
rightCheckNum:0,
|
|
rightMaxUserNum:0,
|
|
rightMaxUserNum:0,
|
|
rightCheckUserIds:[],
|
|
rightCheckUserIds:[],
|
|
@@ -192,8 +193,26 @@
|
|
|
|
|
|
},
|
|
},
|
|
methods:{
|
|
methods:{
|
|
|
|
+ //获取二级单位列表
|
|
|
|
+ getDeptDropList(){
|
|
|
|
+ getDeptDropList({level:2 }).then(response => {
|
|
|
|
+ this.$set(this,'sectionOptionList',response.data);
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ //新增用户
|
|
|
|
+ userAdd(){
|
|
|
|
+ this.userList.push()
|
|
|
|
+ },
|
|
|
|
+ //删除用户
|
|
|
|
+ userDel(){
|
|
|
|
+
|
|
|
|
+ },
|
|
//开启
|
|
//开启
|
|
userDialogOpen(){
|
|
userDialogOpen(){
|
|
|
|
+ this.getDeptDropList();
|
|
|
|
+ this.$set(this,'userList',this.addDialogData.userList);
|
|
|
|
+ this.leftGetList();
|
|
|
|
+ this.rightGetList();
|
|
this.$set(this,'userDialogType',true);
|
|
this.$set(this,'userDialogType',true);
|
|
},
|
|
},
|
|
//关闭
|
|
//关闭
|
|
@@ -206,13 +225,26 @@
|
|
},
|
|
},
|
|
//左侧查询相关
|
|
//左侧查询相关
|
|
leftHandleQuery(){
|
|
leftHandleQuery(){
|
|
-
|
|
|
|
|
|
+ this.$set(this.leftQueryParams,'page',1);
|
|
|
|
+ this.leftGetList();
|
|
},
|
|
},
|
|
leftResetQuery(){
|
|
leftResetQuery(){
|
|
-
|
|
|
|
|
|
+ this.$set(this,'leftQueryParams',{
|
|
|
|
+ page:1,
|
|
|
|
+ pageSize:20,
|
|
|
|
+ searchValue:null,
|
|
|
|
+ deptId:null,
|
|
|
|
+ userType:null,
|
|
|
|
+ });
|
|
|
|
+ this.leftGetList();
|
|
},
|
|
},
|
|
leftGetList(){
|
|
leftGetList(){
|
|
-
|
|
|
|
|
|
+ let obj = JSON.parse(JSON.stringify(this.leftQueryParams))
|
|
|
|
+ obj.excludeUserIds = this.userList;
|
|
|
|
+ systemUserSelect(obj).then(response => {
|
|
|
|
+ this.$set(this,'leftDataList',response.data);
|
|
|
|
+ // this.$set(this,'leftTotal',response.data.total);
|
|
|
|
+ });
|
|
},
|
|
},
|
|
userChangeLeft(selection){
|
|
userChangeLeft(selection){
|
|
this.leftCheckNum = selection.length;
|
|
this.leftCheckNum = selection.length;
|
|
@@ -220,13 +252,26 @@
|
|
},
|
|
},
|
|
//右侧查询相关
|
|
//右侧查询相关
|
|
rightHandleQuery(){
|
|
rightHandleQuery(){
|
|
-
|
|
|
|
|
|
+ this.$set(this.rightQueryParams,'page',1);
|
|
|
|
+ this.rightGetList();
|
|
},
|
|
},
|
|
rightResetQuery(){
|
|
rightResetQuery(){
|
|
-
|
|
|
|
|
|
+ this.$set(this,'rightQueryParams',{
|
|
|
|
+ page:1,
|
|
|
|
+ pageSize:20,
|
|
|
|
+ searchValue:null,
|
|
|
|
+ deptId:null,
|
|
|
|
+ userType:null,
|
|
|
|
+ });
|
|
|
|
+ this.rightGetList();
|
|
},
|
|
},
|
|
rightGetList(){
|
|
rightGetList(){
|
|
-
|
|
|
|
|
|
+ let obj = JSON.parse(JSON.stringify(this.rightQueryParams))
|
|
|
|
+ obj.userIds = this.userList;
|
|
|
|
+ systemUserSelect(obj).then(response => {
|
|
|
|
+ this.$set(this,'rightDataList',response.data);
|
|
|
|
+ // this.$set(this,'rightTotal',response.data.total);
|
|
|
|
+ });
|
|
},
|
|
},
|
|
userChangeRight(selection){
|
|
userChangeRight(selection){
|
|
this.rightCheckNum = selection.length;
|
|
this.rightCheckNum = selection.length;
|
|
@@ -273,6 +318,7 @@
|
|
flex-direction: column;
|
|
flex-direction: column;
|
|
flex:1;
|
|
flex:1;
|
|
border:1px solid #E0E0E0;
|
|
border:1px solid #E0E0E0;
|
|
|
|
+ overflow: hidden;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.user-dialog-max-center-box{
|
|
.user-dialog-max-center-box{
|
|
@@ -319,6 +365,7 @@
|
|
flex-direction: column;
|
|
flex-direction: column;
|
|
flex:1;
|
|
flex:1;
|
|
border:1px solid #E0E0E0;
|
|
border:1px solid #E0E0E0;
|
|
|
|
+ overflow: hidden;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|