<template>
	<view class="amms-page">
		<view class="bj">
			<view class="searchs">
				<view class="s_le">
					<view class="title">
						<view class="ti1">AMMS</view>
						<view class="ti2">AMMS</view>
					</view>
					<view class="subtitle">海航技术移动生产门户平台</view>
				</view>
			</view>
		</view>

		<view class="flex justify-center margin-top-sm" style="width: 100%;"
			v-show="urlPrefix.indexOf('amms.hnatechnic.com') < 0">
			<text class="text-bold amms-error-font-color font30">测试环境</text>
		</view>
		<view class="flex justify-around flex-wrap user-view">
			<view class="margin-top-xl">
				<view class="main-button-block margin-top-xl" @tap="tapLogin('normal')">AMMS<br />外站员工</view>
			</view>
			<view class="margin-top-xl">
				<view class="main-button-block margin-top-xl" @tap="tapLogin('group')">AMMS<br />海航员工</view>
			</view>
			<view class="margin-top-xl">
				<view class="main-button-block margin-top-xl" @tap="loginExamination">网上考试系统<br />外站员工</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		ipConfig
	} from '../../utils/request.js';
	import {
		clearStorageFun
	} from '../../common/index.js';
	import apiMapper from '../../apiMapper/index';

	export default {
		data() {
			return {
				loginImg: '../../static/img/login/i-login.png',
				userImg: '../../static/img/login/i-user.png',
				passwordImg: '../../static/img/login/i-password.png',
				urlPrefix: ''
			};
		},
		onLoad() {
			let token = uni.getStorageSync('access_token') || '';
		},
		mounted() {
			this.urlPrefix = uni.getStorageSync('urlPrefix') ? uni.getStorageSync('urlPrefix') : ipConfig;
		},
		methods: {
			loginExamination() {
				uni.navigateTo({
					url: '/pages/modules/kaoshi/index?isW=1'
				});
			},
			tapLogin(type) {
				if (type === 'group') {
					clearStorageFun();
					if (typeof(window) != 'undefined') {
						window.location.href =`https://login.hnagroup.com/ngiam-rst/cas/login?service=${encodeURIComponent(location.origin + apiMapper['iam-h5'])}&timestamp=${new Date().getTime()}`;
					} else {
						if (this.urlPrefix.indexOf('amms.hnatechnic.com') > -1) {
							uni.navigateTo({
								url: '/pages/login/iam-formal'
							});
						} else {
							uni.navigateTo({
								url: '/pages/login/iam'
							});
						}
					}
				}
				if (type === 'normal') {
					clearStorageFun();
					uni.navigateTo({
						url: '/pages/login/normalLogin'
					});
				}
			}
		}
	};
</script>

<style lang="less" scoped>
	.i-login {
		width: 100%;
		height: 540rpx;
	}

	.main-button-block {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 180rpx;
		width: 280rpx;
		text-align: center;
		border-radius: 46rpx;
		font-size: 30rpx;
		line-height: 45rpx;
		color: #fff;
		padding: 0 20rpx;
		box-sizing: border-box;
		background: linear-gradient(-90deg, #168AFF 0%, #0E57FF 100%);
		animation: blueBreathe 1.5s linear infinite;
		-webkit-animation: blueBreathe 1.5s linear infinite;
		margin: 0;
	}

	@-webkit-keyframes blueBreathe {
		0% {
			box-shadow: 0 0rpx 4rpx #168AFF;
		}

		25% {
			box-shadow: 0 0rpx 12rpx #168AFF;
		}

		50% {
			box-shadow: 0 0rpx 20rpx #168AFF;
		}

		75% {
			box-shadow: 0 0rpx 12rpx #168AFF;
		}

		100% {
			box-shadow: 0 0rpx 4rpx #168AFF;
		}
	}

	@keyframes blueBreathe {
		0% {
			box-shadow: 0 0rpx 4rpx #168AFF;
		}

		25% {
			box-shadow: 0 0rpx 12rpx #168AFF;
		}

		50% {
			box-shadow: 0 0rpx 20rpx #168AFF;
		}

		75% {
			box-shadow: 0 0rpx 12rpx #168AFF;
		}

		100% {
			box-shadow: 0 0rpx 4rpx #168AFF;
		}
	}

	.user-view {
		padding: 32rpx;

		.i-user,
		.i-password {
			width: 40rpx;
			height: 40rpx;
		}
	}

	.bj {
		background: linear-gradient(-90deg, #168AFF 0%, #0E57FF 100%);
		border-radius: 0rpx 0rpx 32rpx 32rpx;
		padding-bottom: 125rpx;
		padding-right: 32rpx;
		padding-left: 32rpx;
		padding-top: 40rpx;
		position: relative;
		box-sizing: border-box;

		.container {
			padding: 0rpx 32rpx;
			box-sizing: border-box;
			position: relative;
		}

		.searchs {
			display: flex;
			align-items: center;
			justify-content: space-between;

			.s_le {
				margin-top: 32rpx;
				width: 100%;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;

				.title {
					position: relative;

					.ti1 {
						font-size: 108rpx;
						font-family: Alibaba-PuHuiTi-B, Alibaba-PuHuiTi;
						font-weight: bold;
						color: #FFFFFF;
						position: absolute;
						top: 14rpx;
						left: 30rpx;
					}

					.ti2 {
						font-size: 132rpx;
						font-family: Alibaba-PuHuiTi-B, Alibaba-PuHuiTi;
						-webkit-text-fill-color: transparent;
						-webkit-text-stroke: 1rpx rgba(255, 255, 255, 0.3);
						font-weight: normal;
						color: rgba(255, 255, 255, 0.5);
					}
				}

				.subtitle {
					font-size: 30rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
				}

				.search {
					width: 400rpx;
					background: #FFFFFF;
					border-radius: 40px;
					display: flex;
					align-items: center;
					padding: 20rpx 32rpx;
					margin-top: 32rpx;

					.content {
						font-size: 28rpx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #CCCCCC;
						margin-left: 16rpx;
					}

					.pic {
						width: 40rpx;
						height: 40rpx;
					}
				}
			}

			.s_ri {
				.pic {
					width: 267rpx;
					height: 286rpx;
				}
			}
		}
	}
</style>