From 1f6893d24ba87313d4114c68813073ead53b2e12 Mon Sep 17 00:00:00 2001
From: zhouwx <1175765986@qq.com>
Date: 星期五, 30 八月 2024 09:26:22 +0800
Subject: [PATCH] 群发新通讯录懒加载
---
src/views/Admin/contactBook/contactors.vue | 2
src/views/Admin/massSend.vue | 246 +++++++++++++++++++++++++++++++++++++++++--------
src/api/contactBook.js | 24 ++++
src/router/index.js | 2
4 files changed, 230 insertions(+), 44 deletions(-)
diff --git a/src/api/contactBook.js b/src/api/contactBook.js
index 3e92f78..203c5ed 100644
--- a/src/api/contactBook.js
+++ b/src/api/contactBook.js
@@ -112,9 +112,27 @@
}
// 通讯录下拉接口
-export function getNewAddressBook(){
+// export function getNewAddressBook(){
+// return request({
+// url: '/org/structure/select/user',
+// method: 'get'
+// })
+// }
+
+//新通讯录-根据平级单位查人
+export function getNewAddressBookUser(id){
return request({
- url: '/org/structure/select/user',
+ url: '/org/user/select/user/' + id,
method: 'get'
})
-}
\ No newline at end of file
+}
+//新通讯录-根据区划查子级以及平级单位
+export function getNewAddressBookArea(){
+ return request({
+ url: '/sys/districtInfo/select/org',
+ method: 'get'
+ })
+}
+
+
+
diff --git a/src/router/index.js b/src/router/index.js
index d070612..f8e86ef 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -8,7 +8,7 @@
{
path: '/',
name: 'login',
- component: () => import('@/views/Login1'),
+ component: () => import('@/views/Login'),
meta: { title: '登录' },
},
{
diff --git a/src/views/Admin/contactBook/contactors.vue b/src/views/Admin/contactBook/contactors.vue
index c01d159..11fb624 100644
--- a/src/views/Admin/contactBook/contactors.vue
+++ b/src/views/Admin/contactBook/contactors.vue
@@ -368,7 +368,9 @@
const t = this
const res = await getStructure()
if(res.data.code == 100){
+ console.log('res',res)
t.treeData = t.filterBranches(res.data.data,['自治区直辖县级行政区划'])
+ console.log('treeData',t.treeData)
// const firstItem = this.firstIdWithOrgStructures(res.data.data[0])
// if(firstItem){
// t.openKeys = [firstItem.id +'-'+ firstItem.name]
diff --git a/src/views/Admin/massSend.vue b/src/views/Admin/massSend.vue
index e19d961..ad09f01 100644
--- a/src/views/Admin/massSend.vue
+++ b/src/views/Admin/massSend.vue
@@ -88,28 +88,49 @@
<a-col :span="12" v-if="isNewTxl == 1">
<div style="display:flex;justify-content: space-between;align-items: center;">
<b>新通讯录接收人:</b>
- <a-checkbox :checked="checkTxlAll1" @change="checkTxlChange1">
- 全选
- </a-checkbox>
+<!-- <a-checkbox :checked="checkTxlAll1" @change="checkTxlChange1">-->
+<!-- 全选-->
+<!-- </a-checkbox>-->
</div>
<a-form-model-item prop="txlUsers">
<a-tree-select
- show-search
- tree-checkable
- style="width: 100%"
+ @change="onChangeUser"
v-model="form.txlUsers"
- :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
- placeholder="选择新通讯录接收人"
- allow-clear
- multiple
- :maxTagCount="3"
- @change="onTxlChanges1"
- @search="onTxlSearch"
- @select="onTxlSelect"
+ tree-checkable
:tree-data="addressBook"
- :replaceFields="replaceTxlFields"
+
+ :replaceFields="{
+ title: 'name', // == 下拉框显示值 ==
+ children: 'children',
+ value: 'id'
+ }"
+ search-placeholder="请选择"
+ class="color-select"
+ :maxTagCount="3"
+ style="min-width: 100%"
+ :dropdownStyle="{ width: '600px' }"
+ :dropdownMatchSelectWidth="false"
+ treeNodeLabelProp="label"
+ :load-data="onLoadData"
>
</a-tree-select>
+<!-- <a-tree-select-->
+<!-- show-search-->
+<!-- tree-checkable-->
+<!-- style="width: 100%"-->
+<!-- v-model="form.txlUsers"-->
+<!-- :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"-->
+<!-- placeholder="选择新通讯录接收人"-->
+<!-- allow-clear-->
+<!-- multiple-->
+<!-- :maxTagCount="3"-->
+<!-- @change="onTxlChanges1"-->
+<!-- @search="onTxlSearch"-->
+<!-- @select="onTxlSelect"-->
+<!-- :tree-data="addressBook"-->
+<!-- :replaceFields="replaceTxlFields"-->
+<!-- >-->
+<!-- </a-tree-select>-->
</a-form-model-item>
</a-col>
<a-col :span="12" v-else>
@@ -226,11 +247,15 @@
import { TreeSelect } from 'ant-design-vue';
import { massSend } from "@/api/send";
import {getUserInfo} from "@/util/storage";
-import {getNewAddressBook} from "@/api/contactBook";
+import {getNewAddressBook, getNewAddressBookArea, getNewAddressBookUser} from "@/api/contactBook";
+import {debounce} from "@/util/debounce";
export default {
name: "massSend",
data() {
return {
+ newBookUsers: [],
+ currentLoadedKeys: [],
+ districtId: null,
userInfo: getUserInfo(),
department: '自治区自然灾害综合监测预警中心',
filteredOptions:[],
@@ -258,10 +283,10 @@
oldAddressBook: [],
addressBook: [],
replaceTxlFields: {
- children:'orgUsers',
+ children:'children',
title:'name',
key:'id',
- value: 'id'
+ value: 'code'
},
replaceOldTxlFields: {
children:'userInfos',
@@ -301,10 +326,12 @@
const t = this
t.unittype = getUserInfo().unittype
t.form.publishingUnit = t.userInfo.company
+ t.districtId = t.userInfo.districtId
t.getUserByGroup()
t.getNewAddressBook()
t.getSameLevel()
t.getAreaUsers()
+
},
computed: {
},
@@ -336,26 +363,147 @@
// 获取新通讯录
async getNewAddressBook(){
let t = this
- let res = await getNewAddressBook()
+ let res = await getNewAddressBookArea()
if(res.data.code == 100){
if(res.data.data){
- let bookData = []
- bookData = res.data.data.filter(i=>i.orgUsers?.length>0)
- for(let j of bookData){
- j['name'] = j.orgName
- j.id = j.id.toString() + '-' + '1'
- j.orgUsers.map((item)=>{
- item.name = item.name + '('+ item.company + ' ' + item.phone.replace(/(\d{3})\d{4}(\d+)/, "$1****$2") + ')'
- return item
- })
- }
- t.addressBook = bookData
+ const data = t.filterBranches(res.data.data,['自治区直辖县级行政区划'])
+ // console.log(' data', data)
+ // let bookData = []
+ // bookData = res.data.data.filter(i=>i.orgUsers?.length>0)
+ // for(let j of bookData){
+ // j['name'] = j.orgName
+ // j.id = j.id.toString() + '-' + '1'
+ // j.orgUsers.map((item)=>{
+ // item.name = item.name + '('+ item.company + ' ' + item.phone.replace(/(\d{3})\d{4}(\d+)/, "$1****$2") + ')'
+ // return item
+ // })
+ // }
+ // t.addressBook = bookData
+ t.addressBook = this.getData(data,'book')
+ console.log(' t.addressBook', t.addressBook)
}else{
console.log('暂无数据')
}
}else{
this.$message.warning(res.data.msg);
}
+ },
+ filterBranches(branches, targetNames) {
+ return branches.filter(branch => {
+ if (targetNames.includes(branch.name)) {
+ return false; // 过滤掉当前分支
+ }
+ if (branch.children && branch.children.length > 0) {
+ branch.children = this.filterBranches(branch.children, targetNames);
+ }
+ return true; // 保留当前分支
+ });
+ },
+ getData(data, dataIndex) {
+ const list = data.map((item, index) => {
+ if (item.children && item.children.length > 0) {
+ item.children = item.children.map((child) => {
+ return {
+ ...child,
+ type: 'children', // 添加标识符,判断是否为children/labels 给需求4使用
+ label: child.name, // a-tree-select 中为选中子节点的内容和展示字节点内容做区分
+ }
+ })
+ this.getData(item.children, dataIndex + '-' + index)
+ } else {
+ item.children = []
+ }
+
+ if (item.orgStructures && item.orgStructures.length > 0) {
+
+ item.children = item.orgStructures.map((label) => {
+ return {
+ ...label,
+ id: label.orgId,
+ type: 'label',
+ label: label.orgName,
+ name: `${label.orgName}`, // 需求2
+ }
+ }).concat(
+ item.children.map((child) => {
+ return {
+ ...child,
+ type: 'children',
+ label: child.name,
+ }
+ })
+ )
+
+
+ // item.children = item.children.map((child) => {
+ // return {
+ // ...child,
+ // type: 'children',
+ // label: child.name,
+ // }
+ // }).concat(
+ // item.orgStructures.map((label) => {
+ // return {
+ // ...label,
+ // id: label.orgId,
+ // type: 'label',
+ // label: label.orgName,
+ // name: `${label.orgName}`, // 需求2
+ // }
+ // })
+ // )
+ }
+ return {
+ ...item,
+ label: item.name,
+ key: dataIndex + '-' + index,
+ }
+ })
+ return list
+ },
+ onChangeUser(value, label, extra){
+ this.form.txlUsers = this.form.txlUsers.filter(item=> {
+ const i = String(item)
+ if(i.indexOf('user') != -1){
+ return item
+ }
+ })
+ },
+ onLoadData(treeNode) {
+ // 懒加载内部数据
+ const _this = this
+ return new Promise(resolve => {
+ if(treeNode.dataRef.children && treeNode.dataRef.children.length>0){
+ resolve()
+ }else {
+ this.loadData(treeNode)
+ resolve()
+ }
+ })
+ },
+ async loadData (treeNode) {
+ let orgId = null
+ if(treeNode.dataRef.orgId){
+ orgId = treeNode.dataRef.orgId.slice(2)
+ }else {
+ orgId = treeNode.dataRef.id
+ }
+ console.log('treeNode',treeNode)
+ let res = await getNewAddressBookUser(orgId)
+ if(res.data.code === 100) {
+
+ this.newBookUsers = this.newBookUsers.concat(res.data.data)
+ treeNode.dataRef.children = res.data.data.map(item => {
+ return {
+ ...item,
+ label: item.name + ' '+ item.phone.replace(/(\d{3})\d{4}(\d+)/, "$1****$2"),
+ name: item.name + '('+ item.company + ' ' + item.phone.replace(/(\d{3})\d{4}(\d+)/, "$1****$2") + ')',
+ id: 'user-' + item.id,
+ isLeaf: true
+ }
+ })
+ this.$forceUpdate();
+ }
},
changeTxl(e){
@@ -446,17 +594,27 @@
this.form.verticalRecipient = []
this.form.horizontalRecipient = []
- const address = this.form.txlUsers.map((item)=>
- {
- this.findUserById(item).recipientType = 3
- const {id,name,phone,company,...rest} = this.findUserById(item)
- const data = { id,name,phone,company }
- data.name = data.name.split('(')[0]
- return data
- }
- )
+ let address = []
+ if(this.isNewTxl == 1){
+ const userIds = this.form.txlUsers.map(item => item.slice(5))
+ address = userIds.map(item => {
+ const {id,name,phone,company,...rest} = this.findUser(item)
+ const data = { id,name,phone,company }
+ console.log('daa',data)
+ return data
+ })
+ }else {
+ address = this.form.txlUsers.map((item)=>
+ {
+ this.findUserById(item).recipientType = 3
+ const {id,name,phone,company,...rest} = this.findUserById(item)
+ const data = { id,name,phone,company }
+ data.name = data.name.split('(')[0]
+ return data
+ }
+ )
+ }
this.form.addressBookRecipient = address
-
const aList = this.form.receiver.map(item=>this.findNodeById(this.areaUsers,item.value)?.users)
if(aList.includes(null)){
this.$message.error('选择接收单位时存在无用户的单位')
@@ -501,6 +659,14 @@
}
})
},
+ findUser(id){
+ for(let i of this.newBookUsers){
+ if(i.id == id){
+ return i
+ }
+ }
+ return null
+ },
onSearch() {
// console.log(...arguments);
--
Gitblit v1.9.2