|
|
@@ -1,12 +1,50 @@
|
|
|
<template>
|
|
|
<view class="main">
|
|
|
- <cu-custom bgColor="bg-blue">
|
|
|
- <block slot="content">通讯录</block>
|
|
|
- </cu-custom>
|
|
|
- <view class="tree">
|
|
|
+ <view class=" text-center flex tab-custom" style="height: 45px;line-height: 45px;">
|
|
|
+ <u-tabs :list="list" @click="changeParent" lineWidth="30" lineHeight="1" lineColor="#ffffff" :activeStyle="{
|
|
|
+ color: '#ffffff',
|
|
|
+ fontWeight: 'bold',
|
|
|
+ transform: 'scale(1.05)'
|
|
|
+ }" :inactiveStyle="{
|
|
|
+ color: '#fff',
|
|
|
+ transform: 'scale(1)'
|
|
|
+ }" itemStyle=" height: 34px;"></u-tabs>
|
|
|
+ </view>
|
|
|
+ <!-- <view class="tree">
|
|
|
<ly-tree :tree-data="officeList" :props="props" node-key="id" :checkOnClickNode="true" :showRadio="false"
|
|
|
:show-checkbox="false" :checkOnlyLeaf="false" ref="officeTree" />
|
|
|
+ </view> -->
|
|
|
+ <view>
|
|
|
+ <u-cell-group class="cell_group__title" v-for="(item, index) in indexList" :key="index"
|
|
|
+ :title="indexList[index].name">
|
|
|
+ <u-cell class="book_info" v-for="user in getUser(indexList[index].id)">
|
|
|
+ <view class="book_info_title" slot="title">
|
|
|
+ {{user.name}}
|
|
|
+ </view>
|
|
|
+ <u-avatar v-if="user.photo!=''" slot="icon" shape="circle" size="40" :src="BASE_URL + user.photo"
|
|
|
+ customStyle="margin: -3px 5px -3px 0"></u-avatar>
|
|
|
+ <u-avatar v-else slot="icon" shape="circle" size="35" src="../../static/img/avatar.png"
|
|
|
+ customStyle="margin: -3px 5px -3px 0"></u-avatar>
|
|
|
+ <view v-if="user.mobile || user.phone" class="ellipsis-description text-gray" slot="label">
|
|
|
+ {{user.mobile + ' ' + user.phone}}
|
|
|
+ </view>
|
|
|
+ <view v-if="user.mobile || user.phone" class="flex" slot="value">
|
|
|
+ <u-icon @click="toPhone(user)" size="30" style="margin-right: 10px;" name="../../static/img/icon_dh.png"></u-icon>
|
|
|
+ <u-icon @click="copyPhone(user)" v-if="user.mobile || user.phone" size="30"
|
|
|
+ name="../../static/img/icon_fz.png"></u-icon>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ </u-cell>
|
|
|
+ </u-cell-group>
|
|
|
</view>
|
|
|
+ <u-modal :show="show" title="选择号码" :showConfirmButton="false" :showCancelButton="true" @cancel="show = false">
|
|
|
+ <view class="slot-content">
|
|
|
+ <view v-for="(item,index) in phones" :key="index">
|
|
|
+ <view @click="toPhone(item)" class="modal_content">{{item}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-modal>
|
|
|
<u-overlay :show="loading">
|
|
|
<view class="warp">
|
|
|
<view class="rect"><u-button plain loading loadingText="加载中"></u-button></view>
|
|
|
@@ -18,15 +56,19 @@
|
|
|
<script>
|
|
|
import userService from '@/api/sys/userService'
|
|
|
import officeService from "@/api/sys/officeService"
|
|
|
+ import BASE_URL from '@/config.js'
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
- loading:true,
|
|
|
+ loading: true,
|
|
|
+ show: false,
|
|
|
indexList: [],
|
|
|
officeList: [],
|
|
|
userList: [],
|
|
|
total: 0,
|
|
|
- searchUserName: ''
|
|
|
+ searchUserName: '',
|
|
|
+ list: [],
|
|
|
+ phones: [],
|
|
|
}
|
|
|
},
|
|
|
props: {
|
|
|
@@ -42,101 +84,73 @@
|
|
|
},
|
|
|
created() {
|
|
|
officeService.treeData().then(data => {
|
|
|
- // this.officeList = data
|
|
|
+ this.officeList = data
|
|
|
+ this.list = this.officeList.filter((item) => {
|
|
|
+ if (item.type == "1") {
|
|
|
+ return true
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.list.sort((a, b) => b.name.localeCompare(a.name) || b.name.localeCompare(a
|
|
|
+ .name));
|
|
|
userService.list({
|
|
|
current: 1,
|
|
|
size: 10000
|
|
|
}).then((res) => {
|
|
|
this.userList = res.records
|
|
|
- this.officeList = this.forItem(data)
|
|
|
+ this.indexList = this.list[0].children
|
|
|
this.total = res.total
|
|
|
- this.loading=false
|
|
|
+ this.loading = false
|
|
|
}).catch((e) => {
|
|
|
throw e
|
|
|
})
|
|
|
-
|
|
|
- })
|
|
|
- userService.list({
|
|
|
- current: 1,
|
|
|
- size: 10000
|
|
|
- }).then((data) => {
|
|
|
- this.userList = data.records
|
|
|
- this.total = data.total
|
|
|
- }).catch((e) => {
|
|
|
- throw e
|
|
|
})
|
|
|
},
|
|
|
- // computed: {
|
|
|
- // list () {
|
|
|
- // let resultList = this.userList.filter((item)=>{
|
|
|
- // if(item.name.indexOf(this.searchUserName) >= 0){
|
|
|
- // return true
|
|
|
- // }
|
|
|
- // })
|
|
|
- // return this.pySegSort(resultList)
|
|
|
- // }
|
|
|
- // },
|
|
|
methods: {
|
|
|
- // 排序
|
|
|
- pySegSort(arr) {
|
|
|
- if (!String.prototype.localeCompare)
|
|
|
- return null;
|
|
|
-
|
|
|
- var letters = "0abcdefghjklmnopqrstwxyz".split('');
|
|
|
- var zh = "阿八嚓哒妸发旮哈讥咔垃痳拏噢妑七呥扨它穵夕丫帀".split('');
|
|
|
-
|
|
|
- var segs = [];
|
|
|
- var curr;
|
|
|
- letters.forEach((item, i) => {
|
|
|
- curr = {
|
|
|
- letter: item,
|
|
|
- data: []
|
|
|
- };
|
|
|
- arr.forEach((item2) => {
|
|
|
- if ((!zh[i - 1] || zh[i - 1].localeCompare(item2.name) <= 0) && item2.name
|
|
|
- .localeCompare(zh[i]) == -1) {
|
|
|
- curr.data.push(item2);
|
|
|
- }
|
|
|
- });
|
|
|
- if (curr.data.length) {
|
|
|
- segs.push(curr);
|
|
|
- this.indexList.push(curr.letter)
|
|
|
- curr.data.sort((a, b) => {
|
|
|
- return a.name.localeCompare(b.name);
|
|
|
+ // 切换部门
|
|
|
+ changeParent(e) {
|
|
|
+ this.indexList = e.children
|
|
|
+ },
|
|
|
+ // 获取用户
|
|
|
+ getUser(id) {
|
|
|
+ let b = this.userList.filter(item => item.officeDTO && item.officeDTO.id == id)
|
|
|
+ return b
|
|
|
+ },
|
|
|
+ // 打电话
|
|
|
+ toPhone(user) {
|
|
|
+ if (user.mobile || user.phone) {
|
|
|
+ if (user.mobile != '' && user.phone == '') {
|
|
|
+ uni.makePhoneCall({
|
|
|
+ phoneNumber: user.mobile //仅为示例
|
|
|
+ });
|
|
|
+ } else if (user.mobile == '' && user.phone != '') {
|
|
|
+ uni.makePhoneCall({
|
|
|
+ phoneNumber: user.phone //仅为示例
|
|
|
});
|
|
|
+ } else if (user.mobile != '' && user.phone != '') {
|
|
|
+ this.phones = []
|
|
|
+ this.phones.push(user.mobile)
|
|
|
+ this.phones.push(user.phone)
|
|
|
+ this.show = true
|
|
|
}
|
|
|
- });
|
|
|
- return segs;
|
|
|
+ } else {
|
|
|
+ this.show = false
|
|
|
+ uni.makePhoneCall({
|
|
|
+ phoneNumber: user //仅为示例
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
},
|
|
|
- // 遍历
|
|
|
- forItem(list) {
|
|
|
- for (let i = 0; i < list.length; i++) {
|
|
|
- let b = []
|
|
|
- if(list[i].icon) continue;
|
|
|
- b = this.userList.filter(item => item.officeDTO && item.officeDTO.id == list[i].id)
|
|
|
- if (b.length > 0) {
|
|
|
- b.forEach(item => {
|
|
|
- this.$set(item, "icon", "/static/img/flat-avatar.png");
|
|
|
- })
|
|
|
- if (list[i].children) {
|
|
|
- list[i].children = list[i].children.concat(b);
|
|
|
- this.forItem(list[i].children)
|
|
|
- } else {
|
|
|
- this.$set(list[i], "children", b);
|
|
|
- }
|
|
|
- } else {
|
|
|
- if (list[i].children && list[i].children.length > 0) {
|
|
|
- this.forItem(list[i].children)
|
|
|
- } else {
|
|
|
- let no = [{
|
|
|
- id: "no001",
|
|
|
- name: '暂无人员'
|
|
|
- }]
|
|
|
- this.$set(list[i], "children", no);
|
|
|
- }
|
|
|
+ // 复制号码
|
|
|
+ copyPhone(user) {
|
|
|
+ uni.setClipboardData({
|
|
|
+ data: user.phone + " " + user.mobile,
|
|
|
+ success: function() {
|
|
|
+ uni.showToast({
|
|
|
+ title: '复制成功',
|
|
|
+ icon: 'success'
|
|
|
+ });
|
|
|
}
|
|
|
- }
|
|
|
- return list;
|
|
|
+ });
|
|
|
},
|
|
|
}
|
|
|
}
|
|
|
@@ -149,6 +163,39 @@
|
|
|
justify-content: center;
|
|
|
height: 100%;
|
|
|
}
|
|
|
+
|
|
|
+ .book_info {
|
|
|
+ background-color: #fefefe;
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .book_info .cell_group__title span {
|
|
|
+ // background-color: #ededed;
|
|
|
+ font-size: 18px !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .book_info .ellipsis-description {
|
|
|
+ font-size: 12px !important;
|
|
|
+ margin-top: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .main .tab-custom {
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ background-color: #36a7f3;
|
|
|
+ }
|
|
|
+
|
|
|
+ .main .modal_content {
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ border-bottom: 1px solid #ededed;
|
|
|
+ z-index: 10;
|
|
|
+ }
|
|
|
+
|
|
|
+ .book_info_title {
|
|
|
+ color: #21b7fc;
|
|
|
+ }
|
|
|
+
|
|
|
.list {
|
|
|
|
|
|
&__item {
|
