<template>
	<!-- :style="{ height: `calc(100vh - ${43 + tabbarHeight}px)` }" -->
	<view class="g_bg_f_5">
		<div style="height: 10px"></div>
		<div class="g_bg_f_5" style="width: calc(100% - 40rpx); margin: 0px auto 10px">
			<div class="">
				<view style="background-color: #ededed; padding: 0 12px">
					<u-search placeholder="请输入手机号" :show-action="false" bg-color="#fff" placeholder-class="g_c_c" :input-style="{ fontSize: '16px' }" height="80" search-icon-color="#999999" v-model="wxyx_tel" @search="handleSearch" @custom="handleCustom"></u-search>
				</view>
			</div>
			<div class="g_flex_row_between g_pl_10 g_pr_10" v-if="receiverUserData && receiverUserData.userId" style="background-color: #fff; border-radius: 8px; padding: 12px 10px; margin-top: 10px">
				<div class="g_flex_1">
					<div style="font-size: 16px; font-weight: 600">
						{{ receiverUserData.tel || "-" }}
					</div>
					<div style="color: #a1a1a1; font-size: 14px; margin-top: 8px">
						{{ receiverUserData.userName || "-" }}
					</div>
				</div>
				<div class="g_flex_none g_ml_12 g_flex_column_center">
					<div>
						<u-button :loading="isStart" type="primary" size="mini" @click="startChat">开始聊天</u-button>
					</div>
				</div>
			</div>
			<div class="nei-box g_mt_10" style="background-color: #fff; border-radius: 8px" v-if="allUser && allUser.length > 0">
				<!-- <div class="label-title" style="font-size: 16px; font-weight: 600; padding: 12px 16px; border-bottom: 1px solid #eee">内部通讯录</div> -->
				<div v-for="(item, index) in allUser" :key="index" @click="startCopyChat(item)" class="g_flex_row_between g_pt_12 g_pb_12 g_pl_16 g_pr_16 border_bottom">
					<div class="g_flex_1 g_flex_row_start g_fs_16">
						<div class="g_flex_none g_mr_12">
							<image :src="item.imgSrc || 'https://matripe-cms.oss-cn-beijing.aliyuncs.com/1shoudan/defaultAva.svg'" style="width: 48px; height: 48px; border-radius: 50px"></image>
						</div>
						<div class="g_flex_1 g_flex_column_between">
							<div class="g_c_3 g_fs_17" style="line-height: 24px">
								{{ item.userName }}
							</div>
							<div
								class="g_c_3 g_fs_14 g_ell_1"
								style="line-height: 20px"
								:style="{
									color: '#999',
								}"
							>
								{{ item.tel }}
							</div>
						</div>
					</div>
					<!-- <div class="g_flex_1">
						<div style="font-size: 16px; font-weight: 600">
							{{ item.userName || "-" }}
						</div>
						<div style="color: #a1a1a1; font-size: 14px; margin-top: 8px">
							{{ item.tel || "-" }}
						</div>
					</div> -->
					<!-- <div class="g_flex_none g_ml_12 g_flex_column_center">
						<div>
							<u-button :loading="item.isStart" type="primary" size="mini" @click="startCopyChat(item)">开始聊天</u-button>
						</div>
					</div> -->
				</div>
			</div>
		</div>
		<div style="height: 100rpx"></div>
	</view>
</template>

<script>
import { customRedirectTo, customReLaunch, customSwitchTab, customNavigateTo } from "../../utils/customNavigate";
export default {
	data() {
		return {
			allUser: [],
			isStart: false,
			isSend: false,
			wxyx_tel: "",
			receiverUserData: {},
			tabbarHeight: uni.getStorageSync("TABBAR_HEIGHT"),
		};
	},
  onLoad(){
		let that = this;
		that.getCopyUserList();
  },
	created() {

	},
	methods: {
		getCopyUserList() {
			let that = this;
			that.F.wyyxGet(that.api.wyyx_getCorpUserList, {}, (res) => {
				console.log("获取通讯录：", res);
				if (res && res.length > 0) {
					res.forEach((item) => {
						item.isStart = false;
					});
				}
				that.allUser = res;
			});
		},
		handleSearch(e) {
			this.getUserList(e);
		},
		handleCustom(e) {
			this.getUserList(e);
		},
		getUserList(e) {
			let that = this;
			that.F.wyyxGet(
				this.api.wyyx_getCorpUserList,
				{
					key: e,
				},
				(res) => {
					console.log("搜索手机号", res);
					that.receiverUserData = res[0];
				}
			);
		},
		sendPointMessage() {
			let that = this;
			that.isSend = true;

			that.F.wyyxPost(
				that.api.wyyx_sendMessage,
				{
					conversationType: 1,
					senderUserId: uni.getStorageSync("apply-uid"), // 发送者id 即当前登录用户id
					receiverUserId: that.receiverUserData.userId, // 接收方用户id
					text: "我是招呼语" + that.G.getPointTime(),
				},
				(res) => {
					that.isSend = false;
					that.receiverUserData = {};
					that.goYunxin();
				},
				() => {
					that.isSend = false;
				}
			);
		},
		async startCopyChat($item) {
			let that = this;
			$item.isStart = true;
			that.F.wyyxPost(
				that.api.wyyx_create,
				{
					senderUserId: uni.getStorageSync("apply-uid"),
					receiverUserId: $item.userId,
				},
				(res) => {
					$item.isStart = false;
					uni.$UIKitStore.uiStore.selectConversation(res.conversationId);
					customNavigateTo({
						url: "/pages/Chat/index",
					});
				},
				() => {
					$item.isStart = false;
				}
			);
		},
		async startChat() {
			let that = this;
			that.isStart = true;
			that.F.wyyxPost(
				that.api.wyyx_create,
				{
					senderUserId: uni.getStorageSync("apply-uid"),
					receiverUserId: that.receiverUserData.userId,
				},
				(res) => {
					that.isStart = false;
					uni.$UIKitStore.uiStore.selectConversation(res.conversationId);
					that.receiverUserData = {};
					customNavigateTo({
						url: "/pages/Chat/index",
					});
				},
				() => {
					that.isStart = false;
				}
			);
		},
		goYunxin() {
			customNavigateTo({
				url: "/pages/Conversation/index",
			});
		},
	},
};
</script>

<style lang="less">
page {
	background-color: #ededed;
}
.border_bottom {
	position: relative;
	&:not(:last-child):after {
		content: "";
		display: block;
		height: 1rpx;
		width: calc(100% - 80px);
		background: #eee;
		position: absolute;
		bottom: 0;
		right: 0;
	}
}
</style>
