<template>
	<view class="content">
		<!-- 搜索 -->
		<piker-search @handleSearch="handleSearch" :title="'企业名录'" :placeholder='"找企业"' :width="'100'"
			:isAddress="true"></piker-search>

		<!--  -->
		<view class="box">
			<view class="phonelist" v-for="(ite,ind) in list" :key="ind" @click="handledetail(ite)" v-if="list.length">
				<view class="left">
					<image :src="ite.logo" mode="aspectFit"></image>
				</view>
				<view class="right">
					<view class="name">
						<text>{{ite.username}}</text>{{ite.pos}}
					</view>
					<view class="c999 overflow">{{ite.name}}</view>
				</view>
				<view class="tell" v-if="token" @click="handleCall(user.authlist,ite.mobile)" @click.stop>
					<image src="../../static/tall.png"></image>
				</view>
			</view>
			<view class="nolist" v-if="!list.length">
				<image src="../../static/none.png"></image>
				<text>暂无数据</text>
			</view>
		</view>
		<!-- 联系人弹框 -->
		<secratary></secratary>
		<!-- 客服 -->
		<message></message>
		<!-- 底部 -->
		<tabbar :tabInd="1"></tabbar>
	</view>
</template>

<script>
	import {
		mapState
	} from "vuex";
	import tabbar from "@/components/tabBar.vue"
	import pikerSearch from "../../components/search.vue"
	export default {
		data() {
			return {
				list: [],
				page: 1,
				lastPage: 1,
				token: "",
				name: "",
				province: "",
				city: "",
				industryid: "",


			}
		},
		computed: {
			...mapState(["user"]),
			userInfo() {
				return this.user.name ? this.user : uni.getStorageSync('UserInfo')
			}
		},
		components: {
			tabbar,
			pikerSearch
		},
		onLoad() {
			let that = this
			this.handleList()
			that.token = uni.getStorageSync('token')
		},
		onShow() {
			this.$store.commit("changeSecratary", false);
		},
		onReachBottom() {
			let that = this
			if (!this.lastPage || this.page >= this.lastPage) {
				uni.showToast({
					title: '没有更多数据！',
					icon: 'none'
				})
				return
			}
			this.page++
			this.handleList()
		},
		methods: {
			handleList() {
				let that = this
				return that.$model.getUserConList({
					name: that.name,
					province: that.province,
					city: that.city,
					industryid: that.industryid,
					pageNo: that.page,
					pageSize: 10,
				}).then((res) => {
					// console.log("通讯录", res)
					if (res.code != 0) return
					that.list = this.list.concat(res.data.rows)
					that.lastPage = res.data.totalpage
				})
			},
			handleSearch(name, province, city, industryid) {
				// if (!this.token) {
				// 	this.$tools.msg("注册/登录后查看更多查看更多")
				// 	return
				// }
				this.name = name
				this.province = province
				this.city = city
				this.industryid = industryid
				this.list = []
				this.page = 1
				console.log("搜索返回", this.name, this.province, this.city, this.industryid)
				this.handleList()
			},
			// 详情
			handledetail(ite) {
				// if (!this.token) {
				// 	this.$tools.msg("注册/登录后查看更多查看更多")
				// 	return
				// }
				uni.navigateTo({
					url: "/pages/phoneList/detail?id=" + ite.id
				})
			},
			handleCall(authlist, num) {
				let that = this
				console.log("authlist", authlist, that.userInfo)
				if (authlist.length) {
					let arr = authlist.findIndex(v => v.code == 'phone:show')
					if (arr == -1) {
						that.$store.commit("changeSecratary", true);
					} else {
						uni.makePhoneCall({
							phoneNumber: num, //仅为示例
							success: () => {
								console.log("拨打电话成功")
								that.$model.getSetClickNumber({
									userId: that.userInfo.id ? that.userInfo.id : 0,
									clickPhone: num,
								}).then(res => {});
							}
						})
					}
				} else {
					that.$store.commit("changeSecratary", true);
				}
			},

		}
	}
</script>

<style scoped lang="scss">
	.content {
		background-color: #fff;
		padding-bottom: 90px;
	}

	/deep/.serachBox {
		height: 80px !important;
	}

	.right {
		width: calc(100% - 320rpx);
	}

	.box {
		margin-top: 80px;
		width: 100%;
	}
</style>