|
|
@@ -1,13 +1,125 @@
|
|
|
<template>
|
|
|
- <view>
|
|
|
- 通讯录列表
|
|
|
+ <view class="cantacts">
|
|
|
+ <view style="padding: 10px;">
|
|
|
+ <My_search placeholder="搜索名称,手机号" @onSearch="onSearch"></My_search>
|
|
|
+ </view>
|
|
|
+ <view class="content">
|
|
|
+ <view class="type-list">
|
|
|
+ <u-list>
|
|
|
+ <u-list-item v-for="(item,index) in groupList" :key="item.sys_phonebookgroupid">
|
|
|
+ <view :class="['type-item',act == index ? 'active' : '']" @click="typeClick(index,item)">
|
|
|
+ {{ item.groupname }}
|
|
|
+ </view>
|
|
|
+ </u-list-item>
|
|
|
+ </u-list>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="list">
|
|
|
+ <My_listbox ref="List" @getlist="getList" :bottomHeight="70">
|
|
|
+ <List :list="list"></List>
|
|
|
+ </My_listbox>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import List from './list.vue'
|
|
|
export default {
|
|
|
-
|
|
|
+ components:{List},
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ list:[],
|
|
|
+ content: {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 20,
|
|
|
+ "where": {
|
|
|
+ "condition": "",
|
|
|
+ "groupname": ""
|
|
|
+ }
|
|
|
+ },
|
|
|
+ groupParam: {
|
|
|
+ "id": "20240516135202",
|
|
|
+ "content": {
|
|
|
+ "pageNumber": 1,
|
|
|
+ "pageSize": 99999,
|
|
|
+ "where": {
|
|
|
+ "isenable": 1
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ groupList:[],
|
|
|
+ act:0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ onSearch (condition) {
|
|
|
+ this.content.where.condition = condition
|
|
|
+ this.getList(true)
|
|
|
+ },
|
|
|
+ typeClick (index,item) {
|
|
|
+ this.act = index
|
|
|
+ this.content.where.groupname = item.groupname
|
|
|
+ this.getList(true)
|
|
|
+ },
|
|
|
+ getList(init = false) {
|
|
|
+ return new Promise((resolve, reject) => {
|
|
|
+ if (this.paging(this.content, init)) return resolve();
|
|
|
+ this.$Http.basic({
|
|
|
+ "id": "20240516144502",
|
|
|
+ content: this.content
|
|
|
+ }).then(res => {
|
|
|
+ this.$refs.List.setHeight()
|
|
|
+ this.$refs.List.RefreshToComplete()
|
|
|
+ resolve();
|
|
|
+ if (this.cutoff(res.msg)) return;
|
|
|
+ this.list = res.pageNumber == 1 ? res.data : this.list.concat(res.data);
|
|
|
+ console.log("获取通讯录列表", this.list)
|
|
|
+ this.content = this.$refs.List.paging(this.content, res)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ async getGroup () {
|
|
|
+ let res = await this.$Http.basic(this.groupParam)
|
|
|
+ this.groupList = res.data
|
|
|
+ if (this.groupList.length) this.content.where.groupname = this.groupList[0].groupname
|
|
|
+ this.getList()
|
|
|
+ console.log(this.groupList,'分组列表');
|
|
|
+ },
|
|
|
+ onLoad () {
|
|
|
+ this.getGroup()
|
|
|
+ }
|
|
|
+ },
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
-<style></style>
|
|
|
+<style lang="scss">
|
|
|
+.cantacts {
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: #ffffff;
|
|
|
+ .content {
|
|
|
+ font-family: Source Han Sans SC, Source Han Sans SC;
|
|
|
+ display: flex;
|
|
|
+ .type-list {
|
|
|
+ background: #F7F7F7;
|
|
|
+ width: 90px;
|
|
|
+ .type-item {
|
|
|
+ font-weight: 400;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #333333;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ background: #F7F7F7;
|
|
|
+ align-content: center;
|
|
|
+ padding: 12px 16px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .active {
|
|
|
+ background: #ffffff !important;
|
|
|
+ }
|
|
|
+ .list {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|