<template>
	<view class="main" v-bind:style="{ height: client.win_height + 'px' }">
		<view class="one">
			<form>
				<view class="content" v-for="(i,index) in fields" :key="index">
					<view class="title">{{i.label}}：</view>
					<input :value="info[i.model]" :name="i.model" disabled />
				</view>
			</form>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapGetters,
		mapMutations,
		createNamespacedHelpers,
	} from "vuex";
	const {
		mapActions: certAgain
	} = createNamespacedHelpers("certificates_print_again");
	export default {
		data() {
			return {
				info: {},
				fields: [{
						label: '姓名',
						model: 'name'
					},
					{
						label: '身份证号',
						model: 'card'
					}, {
						label: '出生日期',
						model: 'birth'
					}, {
						label: '联系电话',
						model: 'phone'
					},
					{
						label: '职业等级',
						model: 'exam_grade'
					}, {
						label: '发证日期',
						model: 'cert_date'
					}, {
						label: '保安员编号',
						model: 'baoan_num'
					}, {
						label: '证件状态',
						model: 'cert_status'
					}, {
						label: '补打申请原因',
						model: 'make_apply'
					}, {
						label: '补打申请公安机关代码',
						model: 'make_applynum'
					}, {
						label: '补打申请公安机关名称',
						model: 'make_applypolice'
					}, {
						label: '补打申请人',
						model: 'make_applypersonal'
					}, {
						label: '补打申请时间',
						model: 'make_applydate'
					}, {
						label: '补打审核公安机关代码',
						model: 'make_examinenum'
					}, {
						label: '补打审核公安机关名称',
						model: 'make_examinename'
					}, {
						label: '补打审核人',
						model: 'make_examinepersonal'
					}, {
						label: '补打审核时间',
						model: 'make_examinedate'
					}, {
						label: '补打审核意见',
						model: 'make_examineresaon'
					}, {
						label: '打印人',
						model: 'print_personal'
					}, {
						label: '打印公安机关名称',
						model: 'print_policename'
					}, {
						label: '打印时间',
						model: 'print_date'
					},
				]
			};
		},
		created() {},
		onLoad: function(option) {
			this.search(option);
		},
		methods: {
			...certAgain(["fetch"]),
			async search({
				id
			}) {
				const res = await this.fetch({
					id
				});
				if (this.$checkRes(res)) {
					this.$set(this, `info`, res.data);
				}
			},
		},
		computed: {
			...mapState(["user"]),
			...mapGetters(["client"]),
		},

	};
</script>

<style lang="scss">
	.main {
		background-color: #409eff;
		overflow-y: auto;

		.one {
			float: left;
			width: 100%;

			.content {
				padding: 0 10px;
				margin: 10px 0;

				.title {
					font-size: 16px;
					margin: 0 0 8px 0;
					color: #000000;
				}

				input {
					border: 1px solid #ccc;
					border-radius: 5px;
					padding: 10px;
				}
			}
		}
	}
</style>
