ZQ/laws-sinotruk-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[update] 选择用户增加全选所有复选框

Browse Source
This commit is contained in:
lideqin
2024-02-21 15:26:48 +08:00
parent 003d0cb0d1
commit 42776e1d2c
4 changed files with 191 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/selection/UserSelectByContactModal.vue
+48 -1
View File
@@ -1,13 +1,18 @@
<template>
<j-modal
:title="$t('userSelect.selectUser')"
:maskClosable="false"
:width="1000"
:closable="true"
centered
@ok="handleOk"
@cancel="handleCancel"
switchFullscreen
:visible="visible">
<template v-slot:title>
<!-- 全选所有 -->
<a-checkbox v-if="type === 'checkbox'" v-model="isCheckedAll" class="modal-title-check" @change="checkedAllChange"/>
<span>{{ $t('userSelect.selectUser') }}</span>
</template>
<div class="modal-search-wrapper table-page-search-wrapper">
<a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
@@ -91,6 +96,19 @@ export default {
this.getUserListByIds(val)
}
}
},
dataSourceRight: {
immediate: true,
deep: true,
handler (val) {
console.log(val.length, this.ipagination.total)
if (val.length !== 0 && val.length === this.ipagination.total) {
// 说明都选中了
this.isCheckedAll = true
} else {
this.isCheckedAll = false
}
}
}
},
data () {
@@ -148,6 +166,7 @@ export default {
selectedRowKeys: [],
loadingLeft: false,
dataSourceRight: [],
isCheckedAll: false, // 是否选中所有
url: {
userList: '/laws/system/lawsContactManage/pageMerge',
userListByIds: '/sys/user/queryByIds'
@@ -166,6 +185,29 @@ export default {
this.getUserListByIds(value)
}
},
// 全选所有
checkedAllChange (e) {
console.log(e.target.checked)
if (e.target.checked) {
this.loadingLeft = true
const params = {}
params.pageNo = 1
params.pageSize = this.ipagination.total + 10
params.column = 'createTime'
params.order = 'desc'
getAction(this.url.userList, params).then(res => {
if (res.success) {
this.dataSourceRight = res.result.records || []
this.selectedRowKeys = (res.result.records || []).map(item => item.contactId)
}
}).finally(() => {
this.loadingLeft = false
})
} else {
this.dataSourceRight = []
this.selectedRowKeys = []
}
},
searchReset () {
this.queryParam = {}
this.loadData()
@@ -298,6 +340,9 @@ export default {
</script>
<style scoped lang="less">
.modal-title-check {
margin-right: 10px;
}
.modal-content {
width: 100%;
display: flex;
@@ -324,6 +369,8 @@ export default {
.name-content {
display: flex;
flex-wrap: wrap;
max-height: 200px;
overflow-y: auto;
.name-div {
width: auto;
padding: 5px 16px;
src/components/selection/UserSelectByContactNoMergeModal.vue
+48 -1
View File
@@ -1,13 +1,18 @@
<template>
<j-modal
:title="$t('userSelect.selectUser')"
:maskClosable="false"
:width="1000"
:closable="true"
centered
@ok="handleOk"
@cancel="handleCancel"
switchFullscreen
:visible="visible">
<template v-slot:title>
<!-- 全选所有 -->
<a-checkbox v-if="type === 'checkbox'" v-model="isCheckedAll" class="modal-title-check" @change="checkedAllChange"/>
<span>{{ $t('userSelect.selectUser') }}</span>
</template>
<div class="modal-search-wrapper table-page-search-wrapper">
<a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
@@ -118,6 +123,19 @@ export default {
this.dataSourceRight = []
}
}
},
dataSourceRight: {
immediate: true,
deep: true,
handler (val) {
console.log(val.length, this.ipagination.total)
if (val.length !== 0 && val.length === this.ipagination.total) {
// 说明都选中了
this.isCheckedAll = true
} else {
this.isCheckedAll = false
}
}
}
},
data () {
@@ -175,6 +193,7 @@ export default {
selectedRowKeys: [],
loadingLeft: false,
dataSourceRight: [],
isCheckedAll: false, // 是否选中所有
url: {
userList: '/laws/system/lawsContactManage/page',
userListByIds: '/laws/system/lawsContactManage/queryById'
@@ -197,6 +216,29 @@ export default {
this.dataSourceRight = []
}
},
// 全选所有
checkedAllChange (e) {
console.log(e.target.checked)
if (e.target.checked) {
this.loadingLeft = true
const params = {}
params.pageNo = 1
params.pageSize = this.ipagination.total + 10
params.column = 'createTime'
params.order = 'desc'
getAction(this.url.userList, params).then(res => {
if (res.success) {
this.dataSourceRight = res.result.records || []
this.selectedRowKeys = (res.result.records || []).map(item => item.id)
}
}).finally(() => {
this.loadingLeft = false
})
} else {
this.dataSourceRight = []
this.selectedRowKeys = []
}
},
searchReset () {
this.queryParam = {}
this.loadData()
@@ -322,6 +364,9 @@ export default {
</script>
<style scoped lang="less">
.modal-title-check {
margin-right: 10px;
}
.modal-content {
width: 100%;
display: flex;
@@ -348,6 +393,8 @@ export default {
.name-content {
display: flex;
flex-wrap: wrap;
max-height: 200px;
overflow-y: auto;
.name-div {
width: auto;
padding: 5px 16px;
src/components/selection/UserSelectByWorkGroupModal.vue
+46 -1
View File
@@ -1,13 +1,18 @@
<template>
<j-modal
:title="$t('userSelect.selectUser')"
:maskClosable="false"
:width="1200"
:closable="true"
centered
@ok="handleOk"
@cancel="handleCancel"
switchFullscreen
:visible="visible">
<template v-slot:title>
<!-- 全选所有 -->
<a-checkbox v-if="type === 'checkbox'" v-model="isCheckedAll" class="modal-title-check" @change="checkedAllChange"/>
<span>{{ $t('userSelect.selectUser') }}</span>
</template>
<div class="modal-top-wrapper">
<div class="modal-left-wrapper">
<a-spin :spinning="treeLoading">
@@ -144,6 +149,19 @@ export default {
this.getUserListByIds(val)
}
}
},
dataSourceRight: {
immediate: true,
deep: true,
handler (val) {
console.log(val.length, this.ipagination.total)
if (val.length !== 0 && val.length === this.ipagination.total) {
// 说明都选中了
this.isCheckedAll = true
} else {
this.isCheckedAll = false
}
}
}
},
data () {
@@ -202,6 +220,7 @@ export default {
loadingLeft: false,
dataSourceRight: [],
workingGroupTreeList: [], // 内部工作组下拉框数据
isCheckedAll: false, // 是否选中所有
url: {
userList: '/act/user/workGroupPage',
userListByIds: '/sys/user/queryByIds'
@@ -265,6 +284,27 @@ export default {
return item
})
},
// 全选所有
checkedAllChange (e) {
console.log(e.target.checked)
if (e.target.checked) {
this.loadingLeft = true
const params = {}
params.pageNo = 1
params.pageSize = this.ipagination.total + 10
getAction(this.url.userList, params).then(res => {
if (res.success) {
this.dataSourceRight = res.result.records || []
this.selectedRowKeys = (res.result.records || []).map(item => item.userId)
}
}).finally(() => {
this.loadingLeft = false
})
} else {
this.dataSourceRight = []
this.selectedRowKeys = []
}
},
searchReset () {
this.queryParam = {}
this.loadData()
@@ -390,6 +430,9 @@ export default {
<style scoped lang="less">
@import '~@assets/less/common.less';
.modal-title-check {
margin-right: 10px;
}
.modal-top-wrapper {
display: flex;
height: 480px;
@@ -430,6 +473,8 @@ export default {
.name-content {
display: flex;
flex-wrap: wrap;
max-height: 200px;
overflow-y: auto;
.name-div {
width: auto;
padding: 5px 16px;
src/components/selection/UserSelectModal.vue
+49 -1
View File
@@ -1,13 +1,18 @@
<template>
<j-modal
:title="$t('userSelect.selectUser')"
:maskClosable="false"
:width="1000"
:closable="true"
centered
@ok="handleOk"
@cancel="handleCancel"
switchFullscreen
:visible="visible">
<template v-slot:title>
<!-- 全选所有 -->
<a-checkbox v-if="type === 'checkbox'" v-model="isCheckedAll" class="modal-title-check" @change="checkedAllChange"/>
<span>{{ $t('userSelect.selectUser') }}</span>
</template>
<div class="modal-search-wrapper table-page-search-wrapper">
<a-form layout="inline" @keyup.enter.native="searchQuery">
<a-row :gutter="24">
@@ -119,6 +124,19 @@ export default {
this.getUserListByIds(val)
}
}
},
dataSourceRight: {
immediate: true,
deep: true,
handler (val) {
console.log(val.length, this.ipagination.total)
if (val.length !== 0 && val.length === this.ipagination.total) {
// 说明都选中了
this.isCheckedAll = true
} else {
this.isCheckedAll = false
}
}
}
},
data () {
@@ -174,6 +192,7 @@ export default {
selectedRowKeys: [],
loadingLeft: false,
dataSourceRight: [],
isCheckedAll: false, // 是否选中所有
url: {
userList: '/sys/user/page',
userListByIds: '/sys/user/queryByIds'
@@ -211,6 +230,30 @@ export default {
}
})
},
// 全选所有
checkedAllChange (e) {
console.log(e.target.checked)
if (e.target.checked) {
this.loadingLeft = true
const params = {}
params.pageNo = 1
params.pageSize = this.ipagination.total + 10
params.field = 'id,avatar,username,realname,sex_dictText,phone,orgCodeTxt,roleTxt,status_dictText'
params.column = 'createTime'
params.order = 'desc'
getAction(this.url.userList, params).then(res => {
if (res.success) {
this.dataSourceRight = res.result.records || []
this.selectedRowKeys = (res.result.records || []).map(item => item.id)
}
}).finally(() => {
this.loadingLeft = false
})
} else {
this.dataSourceRight = []
this.selectedRowKeys = []
}
},
searchReset () {
this.queryParam = {}
this.loadData(1)
@@ -342,6 +385,9 @@ export default {
</script>
<style scoped lang="less">
.modal-title-check {
margin-right: 10px;
}
.modal-content {
width: 100%;
display: flex;
@@ -368,6 +414,8 @@ export default {
.name-content {
display: flex;
flex-wrap: wrap;
max-height: 200px;
overflow-y: auto;
.name-div {
width: auto;
padding: 5px 16px;