<template>
	<view class="p-apply-inedx g_w_all g_h_all g_bg_f_5 g_kuaishou g-apply-tab">
		<!-- #ifdef MP-TOUTIAO  -->
		<view class="g_flex_row_center apply-header" v-if="isHaveOrder == 1">
			<view class="g_flex_row_between box">
				<view v-for="(item, index) in tabInfo" :key="index" class="item g_flex_column_center" :class="tabActive == index ? 'item-active' : ''" @click="handleUpdateTab(index)">
					<view class="btn g_flex_c g_fw_600">{{ item.name }}</view>
				</view>
			</view>
		</view>
		<!-- #endif -->

		<view class="g_h_all">
			<!-- #ifdef APP-PLUS || H5 || MP-KUAISHOU || MP-WEIXIN -->
			<view class="" style="height: calc(58px + 50px)"></view>
			<!-- #endif -->
			<view class="">
				<view class="m-box-fixed" :style="{ top: 0 }" v-if="isLogin">
					<view style="background-color: #fff" class="">
						<view class="m-select">
							<view style="height: 52px" class="g_flex_column_center">
								<view class="m-search g_pb_0 g_position_rela" style="padding-bottom: 0; padding-left: 12px; padding-right: 12px">
									<u-search @btnSearch="getSearch" height="80" v-model="keyword" placeholder="搜索姓名/职位/手机号" bg-color="#f5f5f5" :show-action="false" @change="getSearch" @clear="getSearch" @custom="getSearch" @search="getSearch" search-icon-color="#999999" :maxlength="20"></u-search>
									<view class="g_w_all g_h_40 g_position_abso" style="left: 0; top: 12px; z-index: 9999" @click.stop="goSearch"></view>
								</view>
							</view>
						</view>
						<view class="g_h_10 g_bg_f_5"></view>
					</view>
					<view style="width: 100vw" class="g_border_e_b" v-if="isLogin">
						<u-tabs :list="menuList" item-width="126" v-model="menuActive" active-color="#00b666" bar-width="60" bar-height="6" font-size="32" @change="handleUpdateMenu" :gutter="22" duration="0.1" itemWidth="auto" height="84"></u-tabs>
					</view>
				</view>
				<!-- 面板 -->
				<g-list-apply from="home" @uploadList="getList('concat')" bg="" class="" :tabActive="tabActive" :loading="loading" :speed="speed" :isLogin="isLogin" :query.sync="query" :navInfo="navInfo" />
			</view>
		</view>
	</view>
</template>

<script>
export default {
	onReady() {
		this.G.setNavStyle();
	},
	onShareAppMessage() {
		return {
			title: " ",
			imageUrl: "https://matripe-cms.oss-cn-beijing.aliyuncs.com/dailibaoming/APP/shareCard0609.png",
		};
		// return this.G.shareFun();
	},
	data() {
		return {
			isHaveOrder: -1,
			loading: true,
			speed: -1,
			query: {
				page: 1,
				size: 50,
				list: [],
				isFinish: -1,
			},
			GZHInfo: 0,
			cdnBaseImg: this.G.store().cdnBaseImg,
			keyword: "",

			tabActive: 0,
			tabTip: "",
			tabInfo: [
				{
					name: "我报的",
					childList: [
						{
							name: "全部",
							tip: "",
						},
						{
							name: "审核中",
							tip: "10",
						},
						{
							name: "待接待",
							tip: "20",
						},
						{
							name: "待面试",
							tip: "25",
						},
						{
							name: "待入职",
							tip: "30",
						},
						{
							name: "在职中",
							tip: "40,48",
						},
						{
							name: "已完成",
							tip: "21,26,35,45,50",
						},
					],
				},
				{
					name: "报给我的",
					childList: [
						{
							name: "全部",
							tip: "",
						},
						{
							name: "待审核",
							tip: "10",
						},
						{
							name: "待接待",
							tip: "20",
						},
						{
							name: "待面试",
							tip: "25",
						},
						{
							name: "待入职",
							tip: "30",
						},
						{
							name: "在职中",
							tip: "40,48",
						},
						{
							name: "已完成",
							tip: "21,26,35,45,50",
						},
					],
				},
			],
			menuList: [],
			menuActive: 0,
			isLogin: false,
			loginInfo: {},
			navInfo: {},
		};
	},
	onHide() {
		let that = this;
		if (uni.getStorageSync("apply-supplierAccount") == 1) {
			// 有
			that.tabActive = 1;
		} else {
			// 无
			that.tabActive = 0;
		}
		uni.removeStorageSync("apply-tab-active");
	},
	onLoad(options) {
		let that = this;
		if (options.status) {
			that.menuActive = Number(options.status);
			// setTimeout(() => {
			// 	that.menuActive = Number(options.status);
			// }, 200);
		}
	},
	created() {
		let that = this;
    console.log(12312312312);
	},
	onShow() {
		let that = this;
		// 导航栏高度信息
		that.navInfo = that.G.getNavInfo();
		if (uni.getStorageSync("apply-supplierAccount") == 1) {
			// 有
			that.isHaveOrder = 1;
			if (uni.getStorageSync("apply-tab-active") == 1) {
				that.tabActive = 0;
			} else {
				that.tabActive = 1;
			}
		} else {
			// 无
			that.isHaveOrder = 0;
			that.tabActive = 0;
		}
		that.isLogin = uni.getStorageSync("apply-token") ? true : false;
		console.log("that.isLogin", that.isLogin);
		that.loginInfo = uni.getStorageSync("apply-userinfo");
		if (!that.isLogin) {
			that.loading = false;
			that.speed = 0;
			this.menuList = this.tabInfo[this.tabActive].childList;
		} else {
			this.query.page = 1;
			this.menuList = this.tabInfo[this.tabActive].childList;
			this.getList();
		}
		this.getGZHInfo();
	},
	onReachBottom() {
		let that = this;
		this.G.isLogin();
		if (this.G.isLogin()) {
			if (that.query.isFinish == -1 || that.query.isFinish == that.query.size) {
				that.query.page++;
				that.getList("concat");
			}
		}
	},
	methods: {
		getList($type = "init") {
			let that = this;
			console.log("是否登录", that.isLogin);
			if (!that.isLogin) {
				return false;
			}
			that.G.Post(
				that.api.order_list_new,
				{
					pageNum: that.query.page,
					pageSize: that.query.size,
					keys: "",
					classify: 2,
					// classify: that.tabActive + 1,
					statusStr: that.tabInfo[that.tabActive].childList[that.menuActive].tip,
				},
				(res) => {
					console.log("res", res);
					// return
					if (res.recordCount == 0) {
						that.loading = false;
					} else {
						that.loading = true;
					}
					that.$forceUpdate();
					that.speed = res.recordCount;
					that.query.isFinish = res.recordList.length;
					if (that.speed > 0) {
						// uni.setBackgroundColor({
						// 	backgroundColorBottom: "#ffffff",
						// });
						res.recordList.forEach((item, index) => {
							if (item.status == 10) {
								// 待审核 报名时间
								item.time = that.G.getPointTime(item.createTime, "MM--DD HH:MM");
							} else if (item.status == 20) {
								// 待接待 预约接待时间
								item.time = that.G.getPointTime(item.receptionTime, "MM--DD HH:MM");
							} else if (item.status == 21 || item.status == 26 || item.status == 35 || item.status == 48 || item.status == 45) {
								// 已完成 完成时间
								item.time = that.G.getPointTime(item.finishTime, "MM--DD HH:MM");
							} else if (item.status == 25) {
								// 待面试 面试时间
								item.time = that.G.getPointTime(item.interviewTime, "MM--DD HH:MM");
							} else if (item.status == 30) {
								// 待入职 预约入职时间
								item.time = that.G.getPointTime(item.willEntryTime, "MM--DD HH:MM");
							} else if (item.status == 40) {
								// 已入职 入职时间
								item.time = that.G.getPointTime(item.entryTime, "MM--DD HH:MM");
							} else if (item.status == 50) {
								// 已离职 离职时间
								item.time = that.G.getPointTime(item.leaveTime, "MM--DD HH:MM");
							} else {
								item.time = that.G.getPointTime(item.updateTime, "MM--DD HH:MM");
							}

							item.status_text = that.G.getOrderStatus().filter((itm, inx) => {
								return itm.id == item.status;
							})[0].name;
							item.setTitle = that.G.titleToStr(item);
						});
					} else {
						// uni.setBackgroundColor({
						// 	backgroundColorBottom: "#f5f5f5",
						// });
					}
					if ($type == "init") {
						that.query.list = res.recordList;
						// that.query.list = [...res.recordList, ...res.recordList, ...res.recordList, ...res.recordList, ...res.recordList];
					} else {
						that.query.list = that.query.list.concat(res.recordList);
					}
				}
			);
		},
		goTel($item) {
			console.log($item);
			if ($item) {
				uni.makePhoneCall({
					phoneNumber: $item,
				});
			}
		},
		getGZHInfo() {
			let that = this;
			if (that.isLogin) {
				that.G.Get(that.api.user_getGZHstatus, { type: "BMZS" }, (res) => {
					console.log(res);
					that.GZHInfo = res;
				});
			}
		},
		/**
		 * 跳转搜索页
		 */
		goSearch() {
			this.G.isLogin();
			if (this.G.isLogin()) {
				uni.navigateTo({
					url: `/root/other/search?from=apply&active=${this.tabActive}`,
				});
			}
		},
		// 一级tab切换
		handleUpdateTab(e) {
			let that = this;
			console.log("e", e);
			this.tabActive = e;
			this.menuActive = 0;
			this.menuList = this.tabInfo[this.tabActive].childList;
			this.speed = -1;
			this.query.page = 1;
			that.G.isLogin();
			if (that.G.isLogin()) {
				this.getList();
			}
		},
		// 二级tab切换
		handleUpdateMenu($item, $index) {
			let that = this;
			console.log("$item", $item);
			this.menuActive = $item;
			this.speed = -1;
			this.query.page = 1;
			that.G.isLogin();
			if (that.G.isLogin()) {
				this.getList();
			}
		},
		getSearch(e) {},
		goDetail($item, $index) {
			let that = this;
			console.log("$item", $item);
			// return
			uni.navigateTo({
				// url: "/root/detail/apply?id=" + $item.id + "&type=" + (that.tabActive + 1),
				url: `/root/detail/apply?id=${$item.id}&type=${that.tabActive + 1}&relationId=${$item.relationId}`,
			});
		},
		goLogin() {
			uni.reLaunch({
				url: "/pages/login/index",
			});
		},
		toMessage() {
			uni.navigateTo({
				url: "/root/person/message",
			});
		},
	},
};
</script>

<style lang="scss">
.apply-header {
	position: fixed;
	left: 50%;
	transform: translateX(-50%);
	.box {
		padding: 0 2px;
		width: 148px;
		height: 32px;
		background-color: #eeeeee;
		border-radius: 4px;
		.item {
			width: 72px;
			height: 28px;
			margin-top: 2px;
			border-radius: 4px;
			.btn {
				font-size: 14px;
				color: #333;
			}
		}
		.item-active {
			background-color: #fff;
		}
	}
}
.p-apply-inedx {
	width: 100vw;
	background-color: #f5f5f5;
	overflow-x: hidden;
	min-height: 100%;

	.bg_shawdoc {
		background: linear-gradient(180deg, #caf1e0 1%, rgba(249, 249, 249, 0));
	}

	.suffix {
		position: absolute;
		right: 20rpx;
		top: 10px;
		z-index: 1;
		border-top-right-radius: 110rpx;
		border-bottom-right-radius: 110rpx;
	}

	.tab-fixed {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: calc(112rpx + 36px);
		background-color: #fff;
		z-index: 1;
	}

	.m-search {
		.u-icon-wrap {
		}
	}

	.m-search-active {
		.u-icon-wrap {
			position: inherit;
			left: 0rpx;
		}
	}

	.m-select {
		.u-tab-bar {
			bottom: 5px !important;
		}

		.link {
			.item {
				.doc {
					bottom: 0;
					left: 50%;
					transform: translateX(-50%);
				}
			}
		}

		.showdoc {
			// box-shadow: 0 2px 4px rgba(0, 0, 0, .04), 0 0 6px rgba(0, 0, 0, .02);
			border-bottom: 1rpx solid #eee;
			overflow-x: "auto";
			width: 100vw;

			.menu-obj {
				min-width: 422px;

				.menu-btn {
					margin-right: 8px;

					.btn {
						background: rgba(204, 204, 204, 0.2);
						color: #666666;
					}

					&:first-child {
						margin-left: 12px;
					}
				}

				.menu-active {
					.btn {
						background: rgba(0, 182, 102, 0.1);
						color: #00b666;
					}
				}
			}
		}
	}
	.m-login-false {
		height: calc(100% - 92px);
		.m-panel,
		.link {
			height: 100%;
			.m-log {
				height: 100%;
			}
		}
	}
	.m-panel {
		min-height: 100%;
	}
	.m-box-fixed {
		position: fixed;
		left: 0;
		// top: 92px;
		width: 100vw;
		background-color: #fff;
		z-index: 999;
	}
}
</style>
