Blame view

pages/index/contacts.vue 2.69 KB
290144e9   易尊强   第一次
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
  <template>
  	<view class="contacts-v">
  		<mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :sticky="true"
  			:down="downOption" :up="upOption" :bottombar="false">
  			<view class="search-box search-box_sticky">
  				<u-search placeholder="请输入关键词搜索" v-model="keyword" height="72" :show-action="false" @change="search"
  					bg-color="#f0f2f6" shape="square">
  				</u-search>
  			</view>
  			<view class="list-cell u-border-bottom" v-for="(item, i) in list" :key="i" @click="detail(item.id)">
  				<u-avatar :src="baseURL+item.headIcon"></u-avatar>
  				<view class="list-cell-txt">
  					<view class="u-font-30">{{item.realName}}/{{item.account}}</view>
  					<view class="u-font-24 department">{{item.department}}</view>
  				</view>
  			</view>
  		</mescroll-body>
  	</view>
  </template>
  
  <script>
  	import {
  		getImUser
  	} from '@/api/common.js'
  	import resources from '@/libs/resources.js'
  	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
  	import IndexMixin from './mixin.js'
  	export default {
  		mixins: [MescrollMixin, IndexMixin],
  		data() {
  			return {
  				downOption: {
  					use: true,
  					auto: true
  				},
  				upOption: {
  					page: {
  						num: 0,
  						size: 20,
  						time: null
  					},
  					empty: {
  						use: true,
  						icon: resources.message.nodata,
  						tip: "暂无数据",
  						fixed: true,
  						top: "300rpx",
  					},
  					textNoMore: '没有更多数据',
  				},
  				keyword: '',
  				list: []
  			}
  		},
  		computed: {
  			baseURL() {
  				return this.define.baseURL
  			}
  		},
  		methods: {
  			upCallback(page) {
  				let query = {
  					currentPage: page.num,
  					pageSize: page.size,
  					keyword: this.keyword
  				}
  				getImUser(query, {
  					load: page.num == 1
  				}).then(res => {
  					this.mescroll.endSuccess(res.data.list.length);
  					if (page.num == 1) this.list = [];
  					const list = res.data.list;
  					this.list = this.list.concat(list);
  				}).catch(() => {
  					this.mescroll.endErr();
  				})
  			},
  			search() {
  				// 节流,避免输入过快多次请求
  				this.searchTimer && clearTimeout(this.searchTimer)
  				this.searchTimer = setTimeout(() => {
  					this.list = [];
  					this.mescroll.resetUpScroll();
  				}, 300)
  			},
  			detail(id) {
  				uni.navigateTo({
  					url: '/pages/message/userDetail/index?userId=' + id,
  				})
  			}
  		}
  	}
  </script>
  
  <style lang="scss">
  	.contacts-v {
  		.list-cell {
  			display: flex;
  			box-sizing: border-box;
  			width: 100%;
  			padding: 20rpx 32rpx;
  			overflow: hidden;
  			color: $u-content-color;
  			font-size: 28rpx;
  			line-height: 24px;
  			background-color: #fff;
  
  			.list-cell-txt {
  				margin-left: 20rpx;
  
  				.department {
  					color: #9A9A9A;
  				}
  			}
  		}
  	}
  </style>