<template>
	<div>
		<auth @onLogin="userLogin" @onLogout="userLogout" :checkProfile="true" :tipModel="'m2'"></auth>
		<policy-head-list :model="'checkbox'" style="display:none"></policy-head-list>
		<div class="container policy-change-guide-container" v-if="showForm">
			<div class="table">
				<div class="table-header orange">
					<div class="table-header-item w1">{{$t('policyChangeGuide.head1')}}</div>
					<div class="table-header-item w2">{{$t('policyChangeGuide.head2')}}</div>
					<div class="table-header-item w3">{{$t('policyChangeGuide.head3')}}</div>
					<div class="table-header-item w4">{{$t('policyChangeGuide.head4')}}</div>
					<div class="table-header-item w5">{{$t('policyChangeGuide.head5')}}</div>
				</div>
				<div class="table-content">
					<div v-for="(item,index) in i18n.policyChangeGuide.form" :key="index" class="table-content-item">
						<div v-if="index < i18n.policyChangeGuide.form.length-1" class="hl"></div>
						<div class="ww w1">
							<div class="grid">
								<div class="v-line"></div>
								<span :class="{'act':item.projectType == 1}" @click="onProjectHandler(item)" v-html="item.project"> {{item.project}}</span>
							</div>
						</div>
						<div class="ww w2">
							<div class="grid">
								<div class="v-line"></div>
								<span v-html="item.content"> {{item.content}}</span>
							</div>
						</div>
						<div class="ww w3">
							<div class="grid">
								<div class="v-line"></div>
								<span v-html="item.applicant"> {{item.applicant}}</span>
							</div>
						</div>
						<div class="ww w4">
							<div class="grid">
								<div class="v-line"></div>
								<span v-html="item.receptionTime"> {{item.receptionTime}}</span>
							</div>
						</div>
						<div class="ww w5">
							<div class="grid">
								<div class="material" :class="{'pointer':item2.type == 1}" v-for="(item2,index2) in item.materialList" :key="index2">
									<img v-if="item2.type == 1" class="icon" src="@/assets/images/common-form/icon-cf-download.png" alt="">
									<span :class="{'act':item2.type == 1}" v-html="item2.name">{{ item2.name }}</span>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="notice" v-if="showForm">
			<img class="icon" src="@/assets/images/policy-change-guide/icon-pcg-notice.png" alt=""> {{$t("policyChangeGuide.notice")}}&nbsp;<span @click="toContactUs" class="act">{{$t("policyChangeGuide.noticeLink")}}</span>&nbsp;{{$t("policyChangeGuide.noticeTail")}}
		</div>
	</div>

</template>

<script src="./policy-change-guide.js"></script>
<style lang="scss" scoped>
@import "./policy-change-guide.scss";
</style>